/* WolfMC public pages (home, news; the store adds store.css, the launcher launcher.css): one rhythm, the dark card surface, chunky controls and pixel accents. */
.pg{--card:#0f131b;--card-hover:#121722;--edge:#04070d;--ring:#252c38;--ring-hover:#323b4b;--line:#222935;--ink:#eef3fc;--muted:#8b9ab0;--dim:#64748b;--blue:#3f61ea;--blue-deep:#2742b4;--ease:cubic-bezier(.22,1,.36,1);--spring:cubic-bezier(.34,1.56,.64,1);color:var(--ink)}
/* The public pages run edge to edge like the support pages; no default body frame. */
.pg-body{margin:0}
.pg-wrap{width:min(1100px,calc(100% - 64px));margin-inline:auto}
.pg-section{margin-top:96px}
.pg-head{max-width:640px;margin-bottom:26px}
.pg-head h2{margin:0;color:var(--ink);font-size:clamp(26px,3.2vw,36px);font-weight:800;letter-spacing:-.04em;line-height:1.15}
.pg-head p{margin:10px 0 0;color:var(--muted);font-size:15.5px;line-height:1.7}
.pg-head.is-row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;max-width:none}
.pg-card{position:relative;background:var(--card);border:2px solid var(--edge);outline:2px solid var(--ring);outline-offset:-6px;border-radius:10px;box-shadow:0 5px #020407}
a.pg-card,button.pg-card{color:inherit;text-decoration:none;transition:background .2s ease,outline-color .2s ease}
a.pg-card:hover,button.pg-card:hover{background:var(--card-hover);outline-color:var(--ring-hover)}
.pg :focus-visible{outline:2px solid #b3ccff;outline-offset:3px}
.pg-mono{font-family:'Monocraft',WolfMCEventPixel,ui-monospace,monospace;font-weight:400}
.pg-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Buttons and tags */
.pg-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:0 16px;border:2px solid #03060c;border-radius:8px;background:#172131;color:#d9e4f4;font:inherit;font-size:14px;font-weight:650;line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer;box-shadow:inset 0 1px #ffffff14,inset 0 -3px #080d16;transition:background .2s ease,transform .12s ease}
.pg-btn svg{width:17px;height:17px;flex:none}
.pg-btn:hover{background:#1d2a3e;color:#fff}
.pg-btn:active{box-shadow:inset 0 1px #ffffff0f,inset 0 -1px #080d16}
html.wm-motion-off .pg-btn:active,html:not(.wm-motion) .pg-btn:active{transform:translateY(2px)}
.pg-btn.is-primary{background:var(--blue);color:#fff;box-shadow:inset 0 2px #ffffff36,inset 0 -3px var(--blue-deep)}
.pg-btn.is-primary:hover{background:#4c6df2}
.pg-btn.is-primary:active{box-shadow:inset 0 2px #ffffff26,inset 0 -1px var(--blue-deep)}
.pg-btn.is-big{min-height:54px;padding:0 22px;font-size:15.5px;border-radius:10px}
.pg-btn[aria-disabled=true],.pg-btn:disabled{cursor:not-allowed}
.pg-btn[aria-disabled=true]:active,.pg-btn:disabled:active{transform:none}
.pg-btn.is-primary[aria-disabled=true]{background:#33478f;color:#d3dcf8;box-shadow:inset 0 2px #ffffff1f,inset 0 -3px #22306a}
.pg-soon{display:inline-flex;align-items:center;padding:2px 7px;border:1px solid #03060c;border-radius:5px;background:#4d3608;color:#ffe2a0;box-shadow:inset 0 1px #ffffff1f,inset 0 -2px #0000004d;font:400 10px/1.4 'Monocraft',WolfMCEventPixel,monospace;letter-spacing:.05em;white-space:nowrap}
.pg-tag{display:inline-flex;align-items:center;gap:6px;padding:2px 8px;border:1px solid #03060c;border-radius:5px;background:#172131;color:#c6d3e6;font-size:11px;font-weight:650;white-space:nowrap}
.pg-tag svg{width:13px;height:13px;flex:none}
.pg-note{margin:0;color:var(--muted);font-size:13.5px;line-height:1.7}
.pg-note a{color:#c9d8f5;text-decoration:underline;text-underline-offset:3px}
.pg-note a:hover{color:#fff}

/* Live pill */
.pg-live{display:inline-flex;align-items:center;gap:10px;padding:7px 13px;border:2px solid var(--edge);border-radius:10px;background:var(--card);color:#c9d5ea;font-size:14px;box-shadow:inset 0 1px #ffffff0f}
.pg-live b{color:#fff;font-weight:750;font-variant-numeric:tabular-nums}
.pg-dot{width:9px;height:9px;flex:none;border:2px solid #03060c;border-radius:3px;background:#5d6a80}
[data-state=online] .pg-dot,.pg-dot.is-on{background:#4ade80}
[data-state=offline] .pg-dot{background:#ef6b6b}

/* The server address key (the same object as on /play) */
.pg-key{--depth:9px;position:relative;max-width:100%;padding:0 0 var(--depth);border:0;background:none;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.pg-key::before{content:"";position:absolute;inset:var(--depth) 0 0;border:3px solid #03060c;border-radius:18px;background:#b9c8f2;box-shadow:0 8px 0 #02040799}
.pg-key-face{position:relative;display:flex;align-items:center;gap:clamp(12px,1.6vw,18px);padding:14px 14px 14px clamp(20px,2.6vw,30px);border:3px solid #03060c;border-radius:18px;background:#fff;color:#2742b4;box-shadow:inset 0 -5px #dbe3fa;transition:transform .18s var(--ease)}
.pg-key-text{display:grid;min-width:0;font-family:'Monocraft',WolfMCEventPixel,ui-monospace,monospace;font-size:clamp(22px,3.3vw,38px);line-height:1.15;white-space:nowrap}
.pg-key-text>span{grid-area:1/1;text-align:center;transition:opacity .15s ease}
.pg-key-text .is-done{opacity:0}
.pg-key.is-copied .is-text{opacity:0}
.pg-key.is-copied .is-done{opacity:1}
.pg-key-knob{display:grid;place-items:center;flex:none;width:clamp(42px,4vw,52px);aspect-ratio:1;border:3px solid #03060c;border-radius:12px;background:var(--blue);color:#fff;box-shadow:inset 0 3px #ffffff40,inset 0 -5px #2742b4;transition:background-color .2s ease}
.pg-key-knob svg{grid-area:1/1;width:46%;height:46%;transition:opacity .2s ease,transform .3s var(--spring)}
.pg-key-knob svg+svg{opacity:0;transform:scale(.4)}
.pg-key:hover .pg-key-face{transform:translateY(-2px)}
.pg-key:active .pg-key-face{transform:translateY(calc(var(--depth) - 2px))}
.pg-key.is-copied .pg-key-knob{background:#22a477;box-shadow:inset 0 3px #ffffff40,inset 0 -5px #157a57}
.pg-key.is-copied .pg-key-knob svg:first-child{opacity:0;transform:scale(.4)}
.pg-key.is-copied .pg-key-knob svg+svg{opacity:1;transform:none}

/* FAQ */
.pg-faq{display:grid;gap:12px}
.pg-faq details{padding:0;overflow:hidden}
.pg-faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;color:var(--ink);font-size:15.5px;font-weight:650;list-style:none;cursor:pointer}
.pg-faq summary::-webkit-details-marker{display:none}
.pg-faq summary svg{width:17px;height:17px;flex:none;color:var(--muted);transition:transform .25s var(--ease)}
.pg-faq details[open] summary svg{transform:rotate(180deg)}
.pg-faq details>div{padding:0 22px 20px;color:var(--muted);font-size:14.5px;line-height:1.75}
.pg-faq details>div a{color:#c9d8f5;text-decoration:underline;text-underline-offset:3px}

/* Reveal on scroll: wolfmc-motion.js springs it in; without Motion (or with reduced motion) it simply shows. */
html.wm-motion [data-reveal]:not(.is-in){opacity:0}

/* ===== Home: the arrows, the buttons and the hero (the sections below the hero are in home.css) ===== */
.hx-arrow{display:grid;place-items:center;width:40px;height:40px;padding:0;border:2px solid #03060c;border-radius:8px;background:#172131;color:#d9e4f4;cursor:pointer;box-shadow:inset 0 1px #ffffff14,inset 0 -3px #080d16;transition:background .2s ease}
.hx-arrow svg{width:18px;height:18px}
.hx-arrow:hover{background:#1d2a3e;color:#fff}
.hx-arrow:active{transform:translateY(2px);box-shadow:inset 0 1px #ffffff0f,inset 0 -1px #080d16}

/* Pop-in for dialogs (the store product view) */
@keyframes hx-pop{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}

/* Empty news state (home and /news) */
.hx-news-empty{display:grid;justify-items:center;gap:10px;max-width:560px;margin:0 auto;padding:40px 30px;text-align:center}
.hx-news-empty .wm-tile{width:48px;height:48px;border-radius:10px}
.hx-news-empty h3{margin:6px 0 0;font-size:20px;font-weight:800}
.hx-news-empty p{margin:0;color:var(--muted);font-size:14.5px}

/* Responsive */
@media(max-width:760px){
 .pg-wrap{width:calc(100% - 32px)}
 .pg-section{margin-top:72px}
}
@media(prefers-reduced-motion:reduce){
 .pg [data-reveal]{opacity:1}
 .pg-key-face,.pg-key-knob svg{transition:none}
}
/* News: list (lead story, type tabs, card grid) and article (band, cover, prose with contents and share). */
.nx{padding:56px 0 110px}
.nx-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;color:#9aaac2;font-size:13px;font-weight:550}
.nx-meta>*+*:not(.nx-cat):before{content:"";display:inline-block;width:4px;height:4px;margin:0 12px 2px 0;border-radius:1px;background:#3b475a;vertical-align:middle}
.nx-meta>.nx-cat+*:before{display:none}
.nx-cat{display:inline-flex;align-items:center;padding:3px 9px;border:1px solid #03060c;border-radius:5px;background:var(--tile-bg,#2a3548);color:var(--tile-fg,#c3cfe2);box-shadow:inset 0 1px #ffffff26,inset 0 -2px #00000052;font-size:11.5px;font-weight:700;letter-spacing:.02em}
.nx-tone-blue{--cover:#14244c}.nx-tone-green{--cover:#0f3022}.nx-tone-amber{--cover:#36260b}.nx-tone-violet{--cover:#251a4b}.nx-tone-slate{--cover:#18202d}
/* Covers sit flush inside the card's inner ring (4px in from the border, corners concentric with it) and a ring-coloured divider closes them off, so the ring runs unbroken around image and text. */
.nx-cover,.nx-lead-cover,.nx-article-art{position:relative;display:block;overflow:hidden;margin:4px;border:0 solid var(--ring);border-radius:4px;background:var(--cover,#151b26);transition:border-color .25s ease}
.nx-cover img,.nx-lead-cover img,.nx-article-art img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.is-contain img{object-fit:contain;padding:7% 10%;image-rendering:auto}
.nx-byline{display:inline-flex;align-items:center;gap:9px;min-width:0;color:#c9d5ea;font-size:13px;font-weight:600}
.nx-byline img{flex:none;width:28px;height:28px;border:2px solid #03060c;border-radius:7px;background:#172131;object-fit:cover}
.nx-stretch{color:inherit;text-decoration:none}
.nx-stretch:after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit}
.nx-stretch:focus-visible{outline:none}
.nx-stretch:focus-visible:after{outline:2px solid #8fb0ff;outline-offset:3px}

.nx-lead{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);overflow:hidden;transition:outline-color .25s ease,transform .25s var(--ease)}
.nx-lead:hover{outline-color:var(--ring-hover);transform:translateY(-2px)}
.nx-lead:hover .nx-lead-cover{border-color:var(--ring-hover)}
.nx-lead:hover .nx-lead-cover img{transform:scale(1.03)}
.nx-lead-cover{place-self:stretch;aspect-ratio:16/10;margin-right:0;border-right-width:2px;border-radius:4px 0 0 4px}
.nx-lead-body{display:flex;flex-direction:column;gap:16px;padding:clamp(26px,3.4vw,40px)}
.nx-lead-body h2{margin:0;color:var(--ink);font-size:clamp(25px,2.6vw,32px);font-weight:700;letter-spacing:-.6px;line-height:1.18;text-wrap:balance}
.nx-lead-body p{margin:0;color:var(--muted);font-size:15.5px;line-height:1.75}
.nx-lead-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:auto;padding-top:20px;border-top:1px solid var(--line)}
.nx-read{pointer-events:none}
.nx-read svg{width:17px;height:17px}

.nx-list{margin-top:56px}
.nx-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 22px}
/* Type menu: one site button that wears the chosen type's tile; the list opens over the grid on the shared card surface. */
.nx-filter{position:relative;flex:none}
.nx-filter>summary{gap:10px;padding:0 13px 0 7px;list-style:none;user-select:none}
.nx-filter>summary::-webkit-details-marker{display:none}
.nx-filter>summary:focus-visible{outline:2px solid #8fb0ff;outline-offset:2px}
.nx-filter>summary .wm-tile{width:28px;height:28px;border-radius:6px}
.nx-filter>summary .wm-tile svg{width:15px;height:15px}
.nx-filter>summary>svg{width:16px;height:16px;margin-left:2px;color:#8b9ab0;transition:transform .2s var(--ease)}
.nx-filter[open]>summary{background:#1d2a3e;color:#fff}
.nx-filter[open]>summary>svg{transform:rotate(180deg)}
.nx-filter strong{color:#fff;font-weight:650}
.nx-filter-panel{position:absolute;top:calc(100% + 10px);left:0;z-index:30;display:grid;gap:2px;width:260px;padding:10px;background:var(--card);border:2px solid var(--edge);outline:2px solid var(--ring);outline-offset:-6px;border-radius:10px;box-shadow:0 5px #020407;scroll-margin:16px}
.nx-filter[open] .nx-filter-panel{animation:wm-pop .2s cubic-bezier(.16,1,.3,1) both}
.nx-filter-item{display:flex;align-items:center;gap:12px;width:100%;min-height:46px;padding:7px 10px 7px 8px;border:0;border-radius:7px;background:none;color:#aab7ca;font:inherit;font-size:14px;font-weight:600;text-align:left;cursor:pointer;transition:background .16s ease,color .16s ease}
.nx-filter-item:hover{background:#151a24;color:#fff}
.nx-filter-item.is-active{background:#1a202c;color:#fff;box-shadow:inset 0 0 0 1px #2b3342}
.nx-filter-item:focus-visible{outline:2px solid #8fb0ff;outline-offset:-2px}
.nx-filter-name{flex:1;min-width:0}
.nx-filter-num{min-width:24px;padding:2px 7px;border-radius:5px;background:#0a0d13;color:#8b9ab0;box-shadow:inset 0 1px #00000080;font-size:12px;font-weight:650;line-height:1.4;text-align:center}
.nx-filter-item.is-active .nx-filter-num{color:#dbe4f2}
.nx-filter-item>svg{flex:none;width:16px;height:16px;color:#7f9fff;visibility:hidden}
.nx-filter-item.is-active>svg{visibility:visible}
.nx-feed{display:inline-flex;align-items:center;gap:8px;flex:none;color:#9fb3d1;font-size:13px;font-weight:600;text-decoration:none}
.nx-feed svg{width:16px;height:16px;color:#8891f7}
.nx-feed:hover{color:#e1ebfa}

.nx-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.nx-card{position:relative;display:flex;flex-direction:column;overflow:hidden;background:var(--card);border:2px solid var(--edge);outline:2px solid var(--ring);outline-offset:-6px;border-radius:10px;box-shadow:0 5px #020407;transition:outline-color .25s ease,transform .25s var(--ease)}
.nx-card:hover{outline-color:var(--ring-hover);transform:translateY(-3px)}
.nx-card:hover .nx-cover{border-color:var(--ring-hover)}
.nx-card:hover .nx-cover img{transform:scale(1.04)}
.nx-card[hidden]{display:none}
.nx-cover{flex:none;aspect-ratio:16/9;margin-bottom:0;border-bottom-width:2px;border-radius:4px 4px 0 0}
.nx-card-body{display:flex;flex:1;flex-direction:column;gap:11px;padding:18px 20px 20px}
.nx-card h3{margin:2px 0 0;color:var(--ink);font-size:18px;font-weight:650;letter-spacing:-.3px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nx-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.65;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nx-card-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:14px;border-top:1px solid var(--line)}
.nx-minutes{color:#7d8ca3;font-size:12.5px;white-space:nowrap}
.nx-filter-empty{padding:28px;text-align:center}
.nx-more{display:flex;justify-content:center;margin-top:30px}
.nx-more svg{width:17px;height:17px}
.nx-empty{margin-top:8px}
.nx-empty h2{margin:6px 0 0;font-size:20px}

/* The article hero is the standard one (same height and blue on every page); the cover starts below it. */
.nx-hero-copy{position:relative;z-index:1;display:grid;justify-items:center;gap:12px;width:min(860px,calc(100% - 48px));margin-inline:auto;text-align:center}
.nx-hero-copy h1{font-size:clamp(28px,3.6vw,42px);line-height:1.15;text-wrap:balance;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nx-hero-copy>p{max-width:640px;margin:0;color:#e3eaff;font-size:15.5px;line-height:1.65;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nx-hero-copy .nx-meta,.nx-hero-copy .nx-minutes{justify-content:center;color:#e3eaff}
.nx-hero-copy .nx-meta>*+*:not(.nx-cat):before{background:#a9bcf5}
.nx-back{display:inline-flex;align-items:center;gap:7px;padding:6px 12px 6px 9px;border:2px solid #03060c;border-radius:8px;background:#0e1626;color:#dbe6fb;font-size:13px;font-weight:650;text-decoration:none;box-shadow:inset 0 1px #ffffff1a,inset 0 -2px #00000066}
.nx-back svg{width:15px;height:15px}
.nx-back:hover{background:#16213a}
.nx-article{padding:56px 0 110px}
.nx-article-cover{position:relative;overflow:hidden}
.nx-article-art{aspect-ratio:21/9}
/* One box for the article: the text, and beside it the contents and share panels, which stay in view while it scrolls. */
.nx-article-card{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:clamp(28px,4vw,48px);align-items:start;margin-top:28px;padding:clamp(22px,3.4vw,38px) clamp(20px,3.6vw,40px);background:var(--card);border:2px solid var(--edge);outline:2px solid var(--ring);outline-offset:-6px;border-radius:12px;box-shadow:0 5px #020407}
.nx-prose{min-width:0;color:#c7d3e6;font-size:16.5px;line-height:1.85}
.nx-prose>:last-child{margin-bottom:0}
.nx-prose-byline{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:0 0 28px;padding:0 0 20px;border-bottom:1px solid var(--line);color:#7d8ca3;font-size:13px}
.nx-prose>p{margin:0 0 20px}
.nx-prose h2{margin:44px 0 14px;color:var(--ink);font-size:24px;font-weight:700;letter-spacing:-.5px;line-height:1.3;scroll-margin-top:calc(var(--wm-header-top,16px) + var(--wm-header-h,64px) + 24px)}
.nx-prose ul,.nx-prose ol{display:grid;gap:10px;margin:0 0 24px;padding:0;list-style:none}
.nx-prose li{position:relative;padding-left:30px}
.nx-prose ul li:before{content:"";position:absolute;left:6px;top:.72em;width:8px;height:8px;border:2px solid #03060c;border-radius:2px;background:var(--blue)}
.nx-prose ol{counter-reset:nx}
.nx-prose ol li{counter-increment:nx;padding-left:40px}
.nx-prose ol li:before{content:counter(nx);position:absolute;left:0;top:.2em;display:grid;place-items:center;width:26px;height:26px;border:2px solid #03060c;border-radius:6px;background:#172131;color:#dbe6f6;font-size:12.5px;font-weight:700;line-height:1;box-shadow:inset 0 1px #ffffff1a,inset 0 -2px #00000059}
.nx-prose blockquote{margin:28px 0;padding:20px 24px;border:2px solid var(--edge);border-left:4px solid var(--blue);border-radius:8px;background:#0d1320}
.nx-prose blockquote p{margin:0;color:#e3eaf7;font-size:17.5px;line-height:1.7}
.nx-prose cite{display:block;margin-top:10px;color:#8b9ab0;font-size:13px;font-style:normal}
.nx-note{display:flex;gap:14px;align-items:flex-start;margin:26px 0;padding:16px 18px;border:2px solid var(--edge);outline:1px solid #26324a;outline-offset:-4px;border-radius:9px;background:#0d1524}
.nx-note p{margin:3px 0 0;color:#b9c7dc;font-size:15px;line-height:1.7}
.nx-figure{margin:30px 0}
.nx-figure-frame{display:block;overflow:hidden;border:2px solid var(--edge);outline:2px solid var(--ring);outline-offset:-6px;border-radius:10px;background:#0a0e15}
.nx-figure img{display:block;width:100%;height:auto}
.nx-figure figcaption{margin-top:10px;color:#7d8ca3;font-size:13px;text-align:center}
.nx-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:24px 0}
.nx-facts div{padding:13px 15px;border:2px solid var(--edge);border-radius:8px;background:var(--card)}
.nx-facts dt{color:#7d8ca3;font-size:12px;font-weight:600}
.nx-facts dd{margin:4px 0 0;color:var(--ink);font-size:15px;font-weight:650}
.nx-cta{margin:30px 0 0}
.nx-cta .pg-btn svg{width:17px;height:17px}
.nx-aside{position:sticky;top:calc(var(--wm-header-top,16px) + var(--wm-header-h,64px) + 24px);display:grid;gap:18px}
.nx-toc,.nx-share{padding:16px 16px 18px;background:#0b111c;border:2px solid var(--edge);border-radius:10px;box-shadow:inset 0 2px #00000033}
.nx-toc h2,.nx-share h2{margin:0 0 12px;color:#8094b2;font-size:12px;font-weight:650;letter-spacing:.1em;text-transform:uppercase}
.nx-toc ol{display:grid;gap:2px;margin:0;padding:0;list-style:none}
.nx-toc a{display:block;padding:7px 10px 7px 12px;border-left:2px solid #232c3a;color:#93a6c0;font-size:14px;line-height:1.45;text-decoration:none;transition:color .18s ease,border-color .18s ease,background .18s ease}
.nx-toc a:hover{color:#dbe7f8;background:#111826}
.nx-toc a[aria-current="true"]{border-color:var(--blue);color:#fff;background:#121b2c}
.nx-share{display:grid;gap:10px}
.nx-share .pg-btn{justify-content:flex-start;width:100%}
.nx-share .pg-btn svg{width:17px;height:17px}
.nx-share .is-copied{background:#143525;color:#86e0aa}
/* Below the article: the comments and, on the right, the other news in small cards that stay in view. */
.nx-discuss{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(24px,3vw,36px);align-items:start;margin-top:56px}
.nx-discuss>.cm{margin-top:0}
.nx-more-news{position:sticky;top:calc(var(--wm-header-top,16px) + var(--wm-header-h,64px) + 24px)}
.nx-more-news .nx-more-head{align-items:center;min-height:42px;margin-bottom:18px}
.nx-more-news .nx-more-head h2{font-size:20px}
.nx-side-list{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.nx-side-item{position:relative;display:grid;grid-template-columns:112px minmax(0,1fr);gap:12px;align-items:center;padding:6px 14px 6px 6px;background:var(--card);border:2px solid var(--edge);outline:2px solid var(--ring);outline-offset:-6px;border-radius:12px;box-shadow:0 5px #020407;transition:outline-color .25s ease,transform .25s var(--ease)}
.nx-side-item:hover{outline-color:var(--ring-hover);transform:translateY(-2px)}
.nx-side-cover{position:relative;display:block;overflow:hidden;aspect-ratio:16/10;border-radius:7px;background:var(--cover,#151b26)}
.nx-side-cover img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.nx-side-item:hover .nx-side-cover img{transform:scale(1.05)}
.nx-side-body{display:grid;gap:6px;min-width:0;padding:8px 0}
.nx-side-body .nx-meta{gap:4px 8px;font-size:12px}
.nx-side-body .nx-meta>*+*:not(.nx-cat):before{margin-right:8px}
.nx-side-body .nx-cat{padding:2px 7px;font-size:10.5px}
.nx-side-body h3{margin:0;color:var(--ink);font-size:14.5px;font-weight:650;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nx-more-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 0 22px}
.nx-more-head h2{margin:0;color:var(--ink);font-size:26px;font-weight:700;letter-spacing:-.6px}
.nx-more-head a{display:inline-flex;align-items:center;gap:7px;color:#9fb3d1;font-size:14px;font-weight:600;text-decoration:none}
.nx-more-head a svg{width:16px;height:16px}
.nx-more-head a:hover{color:#e1ebfa}
@media(max-width:1020px){.nx-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.nx-article-card{grid-template-columns:1fr;gap:28px}.nx-discuss{grid-template-columns:1fr}.nx-more-news{position:static}.nx-aside{position:static;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.nx-prose{max-width:none}}
@media(max-width:860px){.nx-lead{grid-template-columns:1fr}.nx-lead-cover{margin:4px 4px 0;border-right-width:0;border-bottom-width:2px;border-radius:4px 4px 0 0}}
@media(max-width:620px){.nx{padding-top:36px}.nx-grid{grid-template-columns:1fr}.nx-lead-foot{flex-direction:column;align-items:flex-start}.nx-article-art{aspect-ratio:16/10}.nx-prose{font-size:16px}.nx-more-head{flex-direction:column;align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.nx-card,.nx-lead,.nx-cover img,.nx-lead-cover img,.nx-filter>summary>svg,.nx-filter-item,.nx-toc a{transition:none}.nx-filter[open] .nx-filter-panel{animation:none}.nx-card:hover,.nx-lead:hover{transform:none}.nx-card:hover .nx-cover img,.nx-lead:hover .nx-lead-cover img{transform:none}}
/* Home buttons: the site recipe of the header and maintenance buttons (2px edge, inner light above, inner shade below). */
.hx-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 22px;border:2px solid #04060b;border-radius:7px;font:inherit;font-size:15px;font-weight:700;line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer;transition:filter .15s ease,transform .15s ease}
.pg button.hx-btn{font-family:inherit;font-size:15px;font-weight:700}
.hx-btn svg{width:18px;height:18px;flex:none}
.hx-btn:hover{filter:brightness(1.07)}
html:not(.wm-motion) .hx-btn:active{transform:translateY(2px)}
.hx-btn.is-green{background:#1f9d62;color:#fff;box-shadow:inset 0 2px #ffffff38,inset 0 -3px #137043}
.hx-btn.is-gold{background:#f3c03f;color:#2a1b02;box-shadow:inset 0 2px #ffffff59,inset 0 -3px #b9831a}
.hx-btn.is-discord{background:#5865f2;color:#fff;box-shadow:inset 0 2px #ffffff38,inset 0 -3px #3a44b8}
.hx-btn.is-white{background:#fff;color:#1d3796;box-shadow:inset 0 2px #fff,inset 0 -3px #b9c8f3}
.hx-btn.is-white svg{color:#3f61ea}
.hx-btn.is-navy{background:#111a2e;color:#fff;box-shadow:inset 0 2px #ffffff1f,inset 0 -3px #060a14}
.hx-btn.is-navy svg{color:#9fb6ff}
.hx-btn.is-white:active{box-shadow:inset 0 -1px #b9c8f3}
.hx-btn.is-navy:active{box-shadow:inset 0 -1px #060a14}
.hx-btn.is-green:active{box-shadow:inset 0 -1px #137043}
.hx-btn.is-gold:active{box-shadow:inset 0 -1px #b9831a}
.hx-btn.is-discord:active{box-shadow:inset 0 -1px #3a44b8}
@media(prefers-reduced-motion:reduce){.hx-btn{transition:none}}
/* Home hero: full width and exactly one screen tall; the wordmark on top, then a rule, the address and the
   live player count, then the two buttons — the order of a classic Minecraft server landing hero. */
.jobs-body .pg-home .jobs-masthead.hx-hero{height:100vh;height:100svh;min-height:560px;padding:80px 16px 56px;justify-content:center}
.hx-hero-inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;width:100%;max-width:900px;margin:0 auto;text-align:center}
.pg-home .hx-wordmark{margin:0;color:#fff;font-size:clamp(68px,11.5vw,156px);font-weight:900;line-height:.95;letter-spacing:-.045em;text-shadow:0 4px 0 #2b49b8,0 9px 0 #16233a}
.hx-rule{position:relative;display:block;width:min(560px,86%);height:2px;margin:34px 0 22px;background:#ffffff5c}
.hx-rule::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:10px;border-radius:50%;background:#fff;transform:translate(-50%,-50%)}
.hx-live{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 14px;margin:0 0 30px;color:#eaf0ff;font-size:clamp(17px,1.6vw,21px);font-weight:500}
.hx-live b{color:#fff;font-weight:800;font-variant-numeric:tabular-nums}
.pg .hx-address{display:inline-flex;align-items:center;gap:8px;padding:2px 4px;border:0;border-radius:6px;background:none;color:#fff;font:inherit;font-weight:600;cursor:pointer}
.hx-address:hover span{text-decoration:underline;text-underline-offset:4px}
.hx-address:focus-visible{outline:2px solid #fff;outline-offset:3px}
.hx-address svg{width:18px;height:18px;flex:none;color:#cdd8ff}
.hx-live-sep{color:#ffffff99}
.hx-live[data-state="offline"] .hx-live-count{opacity:.75}
.hx-hero-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}
.hx-hero-actions .hx-btn{min-width:210px;min-height:56px;font-size:16px}
@media(max-width:620px){
 .jobs-body .pg-home .jobs-masthead.hx-hero{min-height:520px;padding-top:96px}
 .hx-rule{margin:26px 0 18px}
 .hx-live-sep{display:none}
 .hx-live{flex-direction:column}
 .hx-hero-actions{flex-direction:column;align-items:stretch;width:min(320px,100%)}
 .hx-hero-actions .hx-btn{min-width:0}
}

/* Back links sit at the start of the page content, below the hero: always reachable, never under the fixed header. */
.pg-backbar{grid-column:1/-1;display:flex;margin:0 0 16px}
.pg-back{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 14px 0 11px;border:2px solid #03060c;border-radius:8px;background:#0f131b;color:#dbe6fb;font-size:13.5px;font-weight:650;text-decoration:none;box-shadow:inset 0 1px #ffffff14,inset 0 -2px #00000066,0 3px #020407;transition:background .16s ease,transform .15s ease}
.pg-back svg{width:16px;height:16px;transition:transform .2s cubic-bezier(.22,1,.36,1)}
.pg-back:hover{background:#151b26;color:#fff}
.pg-back:hover svg{transform:translateX(-3px)}
.pg-back:active{transform:translateY(2px);box-shadow:inset 0 1px #ffffff14,inset 0 -1px #00000066,0 1px #020407}
.pg-back:focus-visible{outline:2px solid #b6d0ff;outline-offset:3px}
.pl-mode-body>.pg-backbar{margin-bottom:-40px}
.nx-hero-copy .nx-meta{margin-top:14px}
@media(prefers-reduced-motion:reduce){.pg-back,.pg-back svg{transition:none}}