/* NOVA website v6 – black & gold game-network design. One stylesheet for every page. */
@font-face{font-family:'Lilita One';src:url('/assets/fonts/lilita-one-latin.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Lilita One';src:url('/assets/fonts/lilita-one-latin-ext.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Monocraft;src:url('/assets/fonts/monocraft.woff2') format('woff2');font-display:swap}
@font-face{font-family:Monocraft;src:url('/assets/fonts/monocraft-bold.woff2') format('woff2');font-weight:700;font-display:swap}

:root{
  --bg:#0e0c0a;--bg-2:#15120e;--bg-3:#1b1712;
  --panel:#1f1a14;--panel-2:#28221a;--line:#33291f;--line-2:#4a3c2b;
  --text:#f5ecdc;--muted:#b9aa92;--dim:#8a7d69;
  --gold:#ffb320;--gold-2:#ffcf4d;--orange:#ff8a00;--deep:#b85d00;--ink:#2a1500;
  --green:#5ee36a;--red:#ff5a4a;
  --head:'Lilita One','Arial Black',Impact,sans-serif;
  --body:'Segoe UI',system-ui,-apple-system,Roboto,'Helvetica Neue',Arial,sans-serif;
  --mono:Monocraft,ui-monospace,Consolas,monospace;
  --r:12px;--wrap:1180px;
  /* names used by dashboard.css */
  --x-mono:var(--mono);--x-ease:cubic-bezier(.2,.8,.2,1);
  --grad:linear-gradient(180deg,#ffd45a 0%,#ffae1f 55%,#ff8a00 100%);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
html.menu-open{overflow:hidden}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 var(--body);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--gold);text-decoration:none}
a:hover{color:var(--gold-2)}
button{font:inherit;color:inherit;cursor:pointer}
code,kbd{font-family:var(--mono);font-size:.86em;background:#0b0907;border:1px solid var(--line);border-radius:6px;padding:.1em .45em;color:var(--gold-2)}
h1,h2,h3{font-family:var(--head);font-weight:400;line-height:1.08;margin:0;letter-spacing:.01em}
p{margin:0}
:focus-visible{outline:3px solid var(--gold-2);outline-offset:3px;border-radius:6px}
::selection{background:var(--gold);color:var(--ink)}
.ic{width:1em;height:1em;flex:none;display:inline-block;vertical-align:-.12em}
svg.ic{fill:currentColor}
.gold{color:var(--gold)}
.mx-wrap,.shell{width:min(100% - 32px,var(--wrap));margin-inline:auto}
.skip-link{position:fixed;left:12px;top:-60px;z-index:200;background:var(--gold);color:var(--ink);padding:10px 16px;border-radius:8px;font-weight:700}
.skip-link:focus{top:12px}
.dot{width:9px;height:9px;border-radius:50%;background:#6b5f50;display:inline-block;flex:none}
.dot.on{background:var(--green);box-shadow:0 0 0 3px #5ee36a33}
.mx-mono{font-family:var(--mono)}

/* ---------- Buttons & chips ---------- */
.mx-btn,.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:44px;padding:0 22px;border:0;border-radius:999px;font:400 17px/1 var(--head);text-transform:uppercase;letter-spacing:.03em;color:var(--ink);background:linear-gradient(180deg,#ffd04a,#ffa514 60%,#ff9300);box-shadow:inset 0 -4px 0 var(--deep),inset 0 2px 0 #fff3,0 6px 18px #ff8a0026;transition:transform .15s,filter .15s,box-shadow .15s;white-space:nowrap;text-decoration:none}
.mx-btn:hover,.btn:hover{color:var(--ink);filter:brightness(1.07);transform:translateY(-2px)}
.mx-btn:active,.btn:active{transform:translateY(1px);box-shadow:inset 0 -1px 0 var(--deep),0 2px 8px #ff8a0026}
.mx-btn .ic,.btn .ic{width:1.05em;height:1.05em}
.mx-btn-sm,.btn-small{min-height:36px;padding:0 16px;font-size:15px}
.mx-btn-lg{min-height:52px;padding:0 30px;font-size:20px}
.mx-btn-xl{min-height:58px;padding:0 34px;font-size:22px}
.mx-btn-dark,.btn-secondary{color:var(--text);background:linear-gradient(180deg,#342b21,#241e17);box-shadow:inset 0 -3px 0 #120f0b,inset 0 1px 0 #ffffff14}
.mx-btn-dark:hover,.btn-secondary:hover{color:#fff}
.mx-btn-dark[aria-current]{box-shadow:inset 0 -3px 0 #120f0b,0 0 0 2px var(--gold)}
.mx-btn-discord{color:#fff;background:linear-gradient(180deg,#6f7bff,#5865f2 60%,#4a55dd);box-shadow:inset 0 -4px 0 #343eb0,inset 0 2px 0 #fff3}
.mx-btn-discord:hover{color:#fff}
.mx-chip{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 12px;border:1px solid var(--line-2);border-radius:8px;background:#0b0907;color:var(--gold-2);font:700 13px/1 var(--mono);transition:border-color .15s,background .15s}
.mx-chip b{font-weight:700}
.mx-chip .ic{color:var(--muted);width:14px;height:14px}
.mx-chip:hover{border-color:var(--gold);background:#16120d}
.mx-chip-inline{min-height:28px;padding:0 9px;margin-left:4px;vertical-align:middle;font-size:12px}
.mx-iconbtn{display:inline-grid;place-items:center;width:38px;height:38px;border:1px solid var(--line-2);border-radius:9px;background:#221c15;color:var(--text);padding:0}
.mx-iconbtn .ic{width:18px;height:18px}
.mx-iconbtn:hover{border-color:var(--gold);color:var(--gold)}
.mx-tag,.tag{display:inline-block;padding:3px 9px;border-radius:999px;background:var(--gold);color:var(--ink);font:400 11px/1.25 var(--head);text-transform:uppercase;letter-spacing:.04em;font-style:normal}
.mx-pill{display:inline-flex;align-items:center;padding:4px 11px;border-radius:999px;border:1px solid var(--line-2);background:#15110d;color:var(--muted);font-size:13px;font-weight:600}
.mx-flag{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:999px;background:#163b1b;color:#9ff5a6;font:400 12px/1.2 var(--head);text-transform:uppercase;letter-spacing:.05em}
.mx-flag::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green)}
.mx-flag-soon{background:#3d2a0c;color:var(--gold-2)}
.mx-flag-soon::before{background:var(--gold)}
.eyebrow,.mx-kicker{font:400 15px/1.2 var(--head);color:var(--orange);text-transform:uppercase;letter-spacing:.08em;margin:0}
.text-link{display:inline-flex;align-items:center;gap:6px;color:var(--gold);font:400 15px/1 var(--head);text-transform:uppercase;letter-spacing:.04em;background:none;border:0;padding:0}
.text-link:hover{color:var(--gold-2)}

/* ---------- Header ---------- */
.mx-header{position:fixed;inset:0 0 auto;z-index:50;background:#16120ee6;border-bottom:3px solid var(--orange);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .2s}
.mx-header.is-scrolled{background:#130f0cf7}
.mx-header-in{height:64px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;width:min(100% - 24px,1400px);margin-inline:auto}
.mx-header-left{display:flex;align-items:center;gap:10px;min-width:0}
.mx-brand{display:inline-flex;align-items:center;gap:10px;color:var(--text);font:400 22px/1 var(--head)}
.mx-brand img{width:40px;height:40px;filter:drop-shadow(0 2px 4px #0008)}
.mx-online{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border-radius:8px;background:#221c15;border:1px solid var(--line);font:700 13px/1 var(--body)}
.mx-nav{display:flex;align-items:center;gap:4px}
.mx-nav a{display:inline-flex;align-items:center;height:38px;padding:0 15px;border-radius:999px;color:var(--text);font:400 16px/1 var(--head);text-transform:uppercase;letter-spacing:.04em;transition:color .15s,background .15s}
.mx-nav a:hover{color:var(--gold)}
.mx-nav a[aria-current]{color:var(--ink);background:linear-gradient(180deg,#ffcb45,#ff9a0a);box-shadow:inset 0 -3px 0 var(--deep),0 4px 14px #ff8a0040}
.mx-header-right{display:flex;justify-content:flex-end;gap:8px}
main{display:block;padding-top:67px}
@media (max-width:1180px){.mx-nav{display:none}.mx-header-in{grid-template-columns:1fr auto}}
@media (max-width:640px){.mx-chip-ip,.mx-header-right .mx-btn-dark{display:none}.mx-online{padding:0 10px}}

/* Drawer */
.mx-drawer{position:fixed;inset:0;z-index:120;background:#000a;display:flex}
.mx-drawer[hidden]{display:none}
.mx-drawer-panel{width:min(360px,88vw);height:100%;background:var(--bg-2);border-right:3px solid var(--orange);display:flex;flex-direction:column;padding:16px;overflow-y:auto;animation:mx-slide .22s ease-out}
@keyframes mx-slide{from{transform:translateX(-30px);opacity:0}}
.mx-drawer-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.mx-drawer nav{display:grid;gap:4px}
.mx-drawer nav a{padding:12px 14px;border-radius:10px;color:var(--text);font:400 19px/1.1 var(--head);text-transform:uppercase;letter-spacing:.03em}
.mx-drawer nav a:hover{background:var(--panel);color:var(--gold)}
.mx-drawer nav a[aria-current]{background:var(--panel-2);color:var(--gold);box-shadow:inset 3px 0 0 var(--gold)}
.mx-drawer-foot{margin-top:auto;display:grid;gap:10px;padding-top:18px}
.mx-drawer-foot .mx-chip{justify-content:center;min-height:44px;font-size:14px}

/* ---------- Toast ---------- */
.mx-toast{position:fixed;left:50%;bottom:24px;z-index:150;transform:translate(-50%,30px);opacity:0;pointer-events:none;padding:12px 20px;border-radius:999px;background:var(--gold);color:var(--ink);font:400 16px/1 var(--head);letter-spacing:.02em;box-shadow:0 10px 30px #0009;transition:.25s}
.mx-toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------- Wordmarks (game logos without artwork) ---------- */
.mx-wordmark{display:inline-block;font:400 clamp(2.6rem,4.2vw,3.5rem)/.92 var(--head);text-transform:uppercase;letter-spacing:.01em;text-align:center;color:var(--wm2,#ffb320);background:linear-gradient(180deg,var(--wm1,#fff0b0) 18%,var(--wm2,#ffb320) 82%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(2px 0 0 #1a0c00) drop-shadow(-2px 0 0 #1a0c00) drop-shadow(0 2px 0 #1a0c00) drop-shadow(0 -2px 0 #1a0c00) drop-shadow(0 5px 0 #0a0500) drop-shadow(0 10px 14px #000a);transform:rotate(-3deg);padding:.08em .06em}
.mx-wm-short{font-size:clamp(3.6rem,5.8vw,4.8rem)}
.mx-wordmark-lg{font-size:clamp(2.8rem,5.4vw,4.2rem)}
.mx-game-logo{width:100%;max-width:300px;height:auto;filter:drop-shadow(0 10px 18px #000b)}

/* ---------- Home: hero ---------- */
.mx-hero{position:relative;isolation:isolate;min-height:min(900px,100svh);display:flex;flex-direction:column;justify-content:center;padding:44px 0 96px;overflow:hidden;margin-top:-3px}
.mx-hero-bg{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center 40%}
.mx-hero-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 42%,#0e0c0a33,#0e0c0ad9 100%),linear-gradient(180deg,#0e0c0a99 0%,#0e0c0a55 40%,#0e0c0a 100%)}
.mx-hero-bg.is-art::after{background:linear-gradient(180deg,transparent 0%,transparent 70%,#0e0c0a 100%)}
.mx-hero::after{content:"";position:absolute;inset:auto 0 0;height:26px;z-index:-1;background:var(--bg);clip-path:polygon(0 60%,4% 60%,4% 20%,9% 20%,9% 55%,15% 55%,15% 0,21% 0,21% 45%,28% 45%,28% 25%,33% 25%,33% 65%,40% 65%,40% 10%,47% 10%,47% 50%,53% 50%,53% 20%,60% 20%,60% 60%,66% 60%,66% 5%,73% 5%,73% 40%,80% 40%,80% 15%,86% 15%,86% 55%,92% 55%,92% 25%,100% 25%,100% 100%,0 100%)}
.mx-char{position:absolute;bottom:20px;z-index:-1;height:min(78%,700px);width:auto;pointer-events:none;filter:drop-shadow(0 18px 30px #000c)}
.mx-char-left{left:max(0px,calc(50% - 820px))}
.mx-char-right{right:max(0px,calc(50% - 820px))}
@media (max-width:1180px){.mx-char{display:none}}
.mx-hero-in{display:flex;flex-direction:column;align-items:center}
.mx-logo{display:grid;grid-template-columns:auto auto;align-items:center;justify-content:center;column-gap:18px;margin:0 0 34px;text-align:left}
.mx-logo img{grid-row:span 2;width:clamp(84px,11vw,150px);height:auto;filter:drop-shadow(0 12px 22px #000c);animation:mx-float 6s ease-in-out infinite}
.mx-logo-word{font:400 clamp(4.2rem,11vw,8.4rem)/.82 var(--head);letter-spacing:.02em;background:linear-gradient(180deg,#fff6c9 8%,#ffd04a 42%,#ff9d0a 72%,#ff7a00 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(3px 0 0 #2a1300) drop-shadow(-3px 0 0 #2a1300) drop-shadow(0 3px 0 #2a1300) drop-shadow(0 -3px 0 #2a1300) drop-shadow(0 7px 0 #160a00) drop-shadow(0 16px 24px #000c)}
.mx-logo-sub{align-self:start;margin-top:10px;font:400 clamp(.85rem,1.6vw,1.15rem)/1 var(--head);color:var(--text);text-transform:uppercase;letter-spacing:.16em;text-shadow:0 2px 0 #000}
@keyframes mx-float{50%{transform:translateY(-8px) rotate(-2deg)}}
.mx-news-head{width:min(100%,800px);display:flex;align-items:baseline;gap:16px;margin-bottom:12px}
.mx-news-head h2{font-size:24px;text-transform:uppercase;color:#fff;text-shadow:0 2px 0 #000}
.mx-news-head a{display:inline-flex;align-items:center;gap:4px;font:400 14px/1 var(--head);text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.mx-news-head a:hover{color:var(--gold)}
.mx-news-grid{width:min(100%,800px);display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mx-news{display:flex;flex-direction:column;border-radius:14px;overflow:hidden;border:2px solid #ffffff1c;background:var(--panel);box-shadow:0 12px 26px #0009;transition:transform .18s,border-color .18s}
.mx-news img{width:100%;aspect-ratio:2.35/1;object-fit:cover;object-position:center 46%;transition:transform .35s}
.mx-news-body{position:relative;z-index:1;flex:1;display:grid;align-content:start;gap:7px;padding:11px 14px 13px;background:var(--panel)}
.mx-news-body b{color:#fff;font:400 17px/1.15 var(--head);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mx-news-meta{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;font-weight:600}
.mx-news:hover{transform:translateY(-3px);border-color:var(--gold)}
.mx-news:hover img{transform:scale(1.04)}
.mx-scroll{position:absolute;left:50%;bottom:34px;transform:translateX(-50%);color:var(--gold);width:52px;display:grid;place-items:center;filter:drop-shadow(0 3px 0 #2a1300);animation:mx-bob 2s ease-in-out infinite}
.mx-scroll .ic{width:52px;height:32px}
@keyframes mx-bob{50%{transform:translate(-50%,8px)}}
@media (max-width:700px){.mx-news-grid{grid-template-columns:1fr}.mx-logo-sub{letter-spacing:.08em}.mx-logo{grid-template-columns:1fr;justify-items:center;text-align:center;row-gap:10px}.mx-logo img{grid-row:auto}.mx-logo-sub{margin-top:4px}.mx-hero{padding-top:30px}}

/* ---------- Home: welcome ---------- */
.mx-welcome{background:var(--bg);padding:70px 0 90px}
.mx-welcome-in{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center}
.mx-media{margin:0;position:relative;border-radius:16px;overflow:hidden;border:3px solid var(--line);box-shadow:0 20px 40px #000a}
.mx-media img{width:100%;aspect-ratio:16/9;object-fit:cover}
.mx-media figcaption{position:absolute;left:12px;top:12px;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border-radius:12px;background:#0e0c0ad9;font-size:12px;color:var(--muted)}
.mx-media figcaption img{width:28px;height:28px;aspect-ratio:auto}
.mx-media figcaption b{display:block;color:#fff;font:400 15px/1.1 var(--head)}
.mx-welcome-copy{display:grid;gap:18px;justify-items:start}
.mx-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:#241d14;border:1px solid var(--line-2);color:var(--gold-2);font:400 13px/1.2 var(--head);text-transform:uppercase;letter-spacing:.05em}
.mx-welcome h2,.mx-play h2,.mx-games h2{font-size:clamp(2.3rem,4.6vw,3.6rem);text-transform:uppercase;color:var(--gold);text-shadow:0 4px 0 #3d1f00}
.mx-welcome-copy p{color:var(--muted);font-size:17px;max-width:520px}
.mx-welcome-copy p b{color:var(--text)}
.mx-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
@media (max-width:900px){.mx-welcome-in{grid-template-columns:1fr;gap:34px}.mx-welcome-copy{order:-1}}

.mx-stage{position:relative;display:grid;justify-items:center;gap:10px;padding:34px 24px 28px;border-radius:18px;border:3px solid var(--line);background:radial-gradient(60% 55% at 50% 38%,#5a3a10 0%,#2a1d0e 45%,#14100c 100%);box-shadow:0 20px 40px #000a;overflow:hidden}
.mx-stage::before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(from 0deg at 50% 38%,#ffb3200d 0deg 10deg,transparent 10deg 20deg);pointer-events:none}
.mx-stage img{position:relative;width:min(62%,290px);filter:drop-shadow(0 18px 26px #000c);animation:mx-float 6s ease-in-out infinite}
.mx-stage-info{position:relative;display:grid;justify-items:center;gap:8px;text-align:center}
.mx-stage-info span{font:400 14px/1 var(--head);text-transform:uppercase;letter-spacing:.1em;color:var(--orange)}
.mx-stage-info .mx-chip{min-height:44px;padding:0 18px;font-size:16px}
.mx-stage-info small{color:var(--muted);font-size:13px}

/* ---------- Home: games ---------- */
.mx-games{position:relative;isolation:isolate;padding:90px 0 100px;overflow:hidden;text-align:center}
.mx-games-bg{position:absolute;inset:-24px;z-index:-1;background-size:cover;background-position:center;filter:blur(7px) brightness(.42) saturate(.9)}
.mx-games::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,var(--bg) 0%,#0e0c0a00 22%,#0e0c0a00 78%,var(--bg) 100%)}
.mx-games h2{color:#fff;text-shadow:0 4px 0 #000}
.mx-games-in>p{max-width:600px;margin:14px auto 46px;color:#e6dac6;font-size:17px;text-shadow:0 1px 2px #000}
.mx-game-row{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.mx-game{display:flex;flex-direction:column;align-items:center;gap:14px;padding:26px 12px 22px;border-radius:18px;color:var(--text);transition:transform .2s,background .2s}
.mx-game:hover{transform:translateY(-6px) scale(1.03);background:#0e0c0a80;color:var(--text)}
.mx-game .mx-wordmark{min-height:2em;display:flex;align-items:center;justify-content:center}
.mx-game-tag{font-weight:600;color:#efe3cf;text-shadow:0 1px 2px #000}
@media (max-width:900px){.mx-game-row{grid-template-columns:repeat(2,1fr);gap:10px}}
@media (max-width:420px){.mx-game-row{grid-template-columns:1fr}}

/* ---------- Home: how to play ---------- */
.mx-play{padding:80px 0 90px;text-align:center}
.mx-play-sub{color:var(--orange);font-size:17px;margin:12px 0 30px}
.mx-tabs{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;margin-bottom:46px}
.mx-tabs button{min-width:240px;min-height:56px;padding:0 26px;border-radius:999px;border:3px solid var(--gold);background:transparent;color:var(--gold);font:400 20px/1 var(--head);text-transform:uppercase;letter-spacing:.03em;transition:.15s}
.mx-tabs button:hover{background:#ffb3201a}
.mx-tabs button[aria-selected=true]{background:linear-gradient(180deg,#ffd04a,#ffa514);color:var(--ink);border-color:#ffb320;box-shadow:inset 0 -4px 0 var(--deep)}
.mx-play-in{display:grid;justify-content:center;text-align:left}
.mx-play-in.has-art{grid-template-columns:minmax(0,640px) minmax(0,1fr);gap:40px;align-items:center;justify-content:stretch}
.mx-play-steps{width:min(100%,640px)}
.mx-play-art img{width:100%;max-width:560px;margin-inline:auto;filter:drop-shadow(0 20px 30px #000a)}
.mx-lined{display:flex;align-items:center;gap:16px;font-size:clamp(1.3rem,2.4vw,1.75rem);color:var(--gold);text-transform:uppercase;margin-bottom:16px}
.mx-lined::before,.mx-lined::after{content:"";flex:1;height:3px;border-radius:3px;background:linear-gradient(90deg,#ffb32000,var(--gold))}
.mx-lined::after{transform:scaleX(-1)}
.mx-steps{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.mx-steps li{display:flex;align-items:center;gap:14px;min-height:46px;padding:8px 14px;border-radius:10px;background:var(--panel);border:1px solid var(--line)}
.mx-steps b{color:var(--gold)}
.mx-step-n{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--gold);color:var(--ink);font:400 15px/1 var(--head);box-shadow:inset 0 -2px 0 var(--deep)}
.mx-note{display:flex;align-items:center;gap:10px;margin-top:20px;padding:12px 16px;border-radius:999px;border:2px solid #5865f266;background:#5865f214;color:var(--muted);font-size:14px}
.mx-note .ic{color:#8d96ff;width:20px;height:20px}
.mx-note a{color:#aab1ff;font-weight:700}
@media (max-width:900px){.mx-play-in.has-art{grid-template-columns:1fr}.mx-play-art{order:-1}.mx-play-art img{max-width:340px}}
@media (max-width:520px){.mx-tabs button{min-width:0;flex:1;font-size:16px;padding:0 12px}.mx-steps li{align-items:flex-start;font-size:15px}.mx-note{border-radius:14px}}

/* ---------- Footer ---------- */
.mx-footer{position:relative;background:#0a0907;padding:64px 0 26px;margin-top:30px}
.mx-footer-edge{position:absolute;left:0;right:0;bottom:100%;width:100%;height:auto;pointer-events:none}
.mx-footer-edge-css{height:30px;background:#0a0907;clip-path:polygon(0 100%,0 55%,6% 55%,6% 20%,12% 20%,12% 60%,19% 60%,19% 35%,26% 35%,26% 70%,34% 70%,34% 15%,41% 15%,41% 50%,49% 50%,49% 30%,57% 30%,57% 65%,64% 65%,64% 10%,72% 10%,72% 45%,79% 45%,79% 25%,87% 25%,87% 60%,94% 60%,94% 30%,100% 30%,100% 100%)}
.mx-footer-in{display:grid;grid-template-columns:auto 1fr auto;gap:48px;align-items:center}
.mx-footer-logo img{width:150px;filter:drop-shadow(0 10px 20px #000)}
.mx-footer-cols{display:flex;justify-content:center;gap:0}
.mx-footer-cols>div{display:grid;align-content:start;gap:7px;padding:0 34px;border-left:1px solid var(--line)}
.mx-footer-cols>div:last-child{border-right:1px solid var(--line)}
.mx-footer h2{font-size:20px;color:var(--orange);text-transform:uppercase;letter-spacing:.03em;margin-bottom:4px}
.mx-footer-cols a{color:#d9ccb6;font-size:15px}
.mx-footer-cols a:hover{color:var(--gold)}
.mx-footer-cta{display:grid;gap:14px;justify-items:center}
.mx-social{display:flex;gap:10px}
.mx-social a{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#5865f2;color:#fff;box-shadow:inset 0 -3px 0 #343eb0;transition:transform .15s}
.mx-social a:hover{transform:translateY(-2px);color:#fff}
.mx-social .ic{width:22px;height:22px}
.mx-footer-bottom{margin-top:44px;padding-top:20px;border-top:1px solid var(--line);display:grid;gap:4px;text-align:center;color:var(--dim);font-size:13px}
@media (max-width:900px){.mx-footer-in{grid-template-columns:1fr;justify-items:center;gap:30px;text-align:center}.mx-footer-cols>div{padding:0 22px}}
@media (max-width:420px){.mx-footer-cols{flex-direction:column;gap:22px}.mx-footer-cols>div,.mx-footer-cols>div:last-child{border:0;padding:0}}

/* ---------- Subpage banner & document area ---------- */
.mx-banner{position:relative;isolation:isolate;overflow:hidden;padding:64px 0 74px;text-align:center;border-bottom:3px solid var(--line)}
.mx-banner-bg{position:absolute;inset:-20px;z-index:-1;background-size:cover;background-position:center;filter:blur(5px) brightness(.36)}
.mx-banner::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#0e0c0a66,#0e0c0a 100%)}
.mx-banner-in{display:grid;justify-items:center;gap:12px}
.mx-banner h1{font-size:clamp(2.6rem,6vw,4.6rem);text-transform:uppercase;color:var(--gold);text-shadow:0 4px 0 #3d1f00,0 10px 30px #000}
.mx-banner h1 .gold{color:inherit}
.mx-lead{max-width:640px;color:#ddd0bb;font-size:17px}
.mx-back{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font:400 13px/1 var(--head);text-transform:uppercase;letter-spacing:.06em}
.mx-back .ic{width:14px;height:14px}
.mx-doc{padding:48px 0 100px;display:grid;gap:22px}
.mx-doc>*{min-width:0}
details>summary{list-style:none;cursor:pointer}
details>summary::-webkit-details-marker{display:none}
.expand-icon{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:var(--panel-2);color:var(--gold);font:400 22px/1 var(--head);transition:transform .2s}
details[open]>summary .expand-icon{transform:rotate(45deg)}

/* Panels shared by subpages */
.pg-note,.pg-card,.grp,.leaderboard,.road-overview,.road-phase,.compact-cta,.update-entry,.rule-sec,.mx-mode,.cmd-tools{background:var(--panel);border:1px solid var(--line);border-radius:var(--r)}
.pg-note{display:flex;gap:16px;align-items:flex-start;padding:18px 20px;border-left:4px solid var(--gold)}
.pg-note b{display:block;font:400 19px/1.2 var(--head);color:var(--gold);margin-bottom:4px}
.pg-note p{color:var(--muted)}
.pg-card-ic,.grp-ic{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:12px;background:#2c2318;color:var(--gold)}
.pg-card-ic svg,.grp-ic svg{width:22px;height:22px;fill:currentColor}
.pg-meta{display:flex;flex-wrap:wrap;gap:8px 20px;color:var(--muted);font-size:14px}
.pg-meta b{color:var(--text)}
.pg-hint{color:var(--muted);font-size:14px}
.pg-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px}
.pg-card{padding:22px 24px}
.pg-card>header{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:16px}
.pg-card h2{font-size:24px;text-transform:uppercase;color:var(--gold)}
.pg-card header p{color:var(--muted);font-size:14px}
.kv{margin:0;display:grid;gap:12px}
.kv div{display:grid;grid-template-columns:110px 1fr;gap:10px}
.kv dt{color:var(--dim);font-weight:600}
.kv dd{margin:0}
.kv-hint{margin-top:14px;color:var(--muted);font-size:14px}
.legal h3{font-size:19px;color:var(--gold-2);margin:22px 0 6px}
.legal h3:first-child{margin-top:0}
.legal p,.legal li{color:#d6c9b3}
.legal p+p{margin-top:8px}
.legal ul{padding-left:20px;margin:8px 0;display:grid;gap:4px}
mark.todo{background:#ffcf4d;color:var(--ink);padding:0 4px;border-radius:4px}

/* Spielmodi page */
.mx-modes{display:grid;gap:22px}
.mx-mode{display:grid;grid-template-columns:320px 1fr;gap:34px;align-items:center;padding:30px 34px;scroll-margin-top:90px}
.mx-mode:target{border-color:var(--gold);box-shadow:0 0 0 2px #ffb32055}
.mx-mode-logo{display:grid;place-items:center;min-height:170px;border-radius:14px;background:radial-gradient(circle at 50% 45%,#3a2b17,#17130f 72%)}
.mx-mode-copy{display:grid;gap:14px;justify-items:start}
.mx-mode-top{display:flex;flex-wrap:wrap;gap:8px}
.mx-mode h2{font-size:clamp(1.6rem,3vw,2.2rem);text-transform:uppercase;color:var(--text)}
.mx-mode p{color:var(--muted);font-size:17px;max-width:620px}
@media (max-width:800px){.mx-mode{grid-template-columns:1fr;padding:22px;gap:20px}.mx-mode-logo{min-height:140px}}

/* Updates page */
.update-entry{display:grid;grid-template-columns:110px 260px 1fr;gap:24px;align-items:start;padding:22px;scroll-margin-top:90px}
.update-entry:target{border-color:var(--gold)}
.update-date{display:grid;gap:8px;justify-items:start}
.update-date time{font:400 20px/1 var(--head);color:var(--gold)}
.update-entry>img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;border:1px solid var(--line)}
.update-entry h2{font-size:24px;text-transform:uppercase;margin-bottom:10px}
.update-entry ul{margin:0;padding-left:20px;display:grid;gap:5px;color:#d6c9b3}
.update-entry li::marker{color:var(--gold)}
@media (max-width:860px){.update-entry{grid-template-columns:1fr;gap:14px}.update-date{grid-auto-flow:column;align-items:center;justify-content:start}}

/* Leaderboard */
.leaderboard{padding:22px;max-width:820px;width:100%;margin-inline:auto}
.board-header{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-bottom:16px}
.seg{display:inline-flex;gap:6px;padding:5px;border-radius:999px;background:#120f0b;border:1px solid var(--line)}
.seg button{min-height:40px;padding:0 20px;border:0;border-radius:999px;background:transparent;color:var(--muted);font:400 16px/1 var(--head);text-transform:uppercase;letter-spacing:.03em}
.seg button:hover{color:var(--gold)}
.seg button[aria-selected=true]{background:var(--gold);color:var(--ink);box-shadow:inset 0 -3px 0 var(--deep)}
.live-status{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:14px;font-weight:600}
.ranks{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ranks li{display:grid;grid-template-columns:44px 36px 1fr auto;align-items:center;gap:12px;padding:8px 14px;border-radius:10px;background:#18140f;border:1px solid var(--line)}
.ranks .r{font:400 20px/1 var(--head);color:var(--dim);text-align:center}
.ranks li:nth-child(1){background:linear-gradient(90deg,#3b2a0d,#18140f 70%);border-color:#6b4c12}
.ranks li:nth-child(1) .r{color:var(--gold)}
.ranks li:nth-child(2) .r{color:#d7dde4}
.ranks li:nth-child(3) .r{color:#e09a5a}
.ranks img{width:36px;height:36px;border-radius:6px;image-rendering:pixelated}
.ranks .name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ranks .val{font:700 16px var(--mono);color:var(--gold-2)}
.board-empty{padding:30px 10px;text-align:center;color:var(--muted)}
.board-updated{margin-top:12px;text-align:center;color:var(--dim);font-size:13px}

/* Roadmap */
.road-overview{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;padding:24px 26px;align-items:center}
.road-overview>div:first-child{flex:1 1 320px;display:grid;gap:10px}
.road-overview strong{font:400 54px/1 var(--head);color:var(--gold);text-shadow:0 4px 0 #3d1f00}
.progress-track{height:14px;border-radius:999px;background:#120f0b;border:1px solid var(--line);overflow:hidden}
.progress-track i{display:block;height:100%;width:0;border-radius:inherit;background:var(--grad)}
.road-counts{display:flex;gap:12px}
.road-counts div{min-width:96px;padding:12px 14px;border-radius:10px;background:#18140f;border:1px solid var(--line);text-align:center}
.road-counts b{display:block;font:400 28px/1 var(--head);color:var(--text)}
.road-counts span{color:var(--muted);font-size:13px}
.road-toolbar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;color:var(--muted)}
.road-phases{display:grid;gap:14px}
.road-phase>summary{display:grid;grid-template-columns:52px 1fr auto 32px;gap:16px;align-items:center;padding:18px 20px}
.phase-number{display:grid;place-items:center;width:52px;height:52px;border-radius:12px;background:#2c2318;color:var(--gold);font:400 22px/1 var(--head)}
.road-phase.complete .phase-number{background:#163b1b;color:#9ff5a6}
.phase-title small{color:var(--orange);font:400 13px/1 var(--head);text-transform:uppercase;letter-spacing:.05em}
.phase-title h2{font-size:24px;text-transform:uppercase;margin:4px 0}
.phase-title p{color:var(--muted);font-size:14px}
.phase-summary{color:var(--muted);font-size:14px;font-weight:600;white-space:nowrap}
.road-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;padding:0 20px 20px}
.road-item{display:grid;grid-template-columns:28px 1fr;gap:4px 12px;padding:14px;border-radius:10px;background:#18140f;border:1px solid var(--line)}
.road-item img{grid-row:span 2;width:28px;height:28px;image-rendering:pixelated}
.road-item h3{font:700 15px/1.3 var(--body)}
.road-item p{color:var(--muted);font-size:13px}
.road-item .state{grid-column:2;justify-self:start;margin-top:6px;padding:2px 9px;border-radius:999px;font:400 11px/1.4 var(--head);text-transform:uppercase;letter-spacing:.04em;background:#2c2318;color:var(--muted)}
.road-item.done .state{background:#163b1b;color:#9ff5a6}
.road-item.progress .state{background:#3d2a0c;color:var(--gold-2)}
.compact-cta{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px;padding:24px 26px}
.compact-cta h2{font-size:24px;text-transform:uppercase;color:var(--gold)}
.compact-cta p{color:var(--muted)}
@media (max-width:640px){.road-phase>summary{grid-template-columns:44px 1fr 32px;padding:14px}.phase-number{width:44px;height:44px}.phase-summary{display:none}.road-items{padding:0 14px 14px}.road-counts{width:100%}.road-counts div{flex:1;min-width:0}}

/* Befehle */
.cmd-tools{display:grid;gap:14px;padding:16px}
.cmd-search{display:flex;align-items:center;gap:10px;padding:0 14px;min-height:48px;border-radius:10px;background:#120f0b;border:1px solid var(--line-2)}
.cmd-search:focus-within{border-color:var(--gold)}
.cmd-search .ic{color:var(--muted);fill:none;stroke:currentColor}
.cmd-search input{flex:1;min-width:0;border:0;background:transparent;color:var(--text);font:16px var(--body);outline:0}
.cmd-chips{display:flex;flex-wrap:wrap;gap:8px}
.chip-f{min-height:36px;padding:0 15px;border-radius:999px;border:1px solid var(--line-2);background:#18140f;color:var(--muted);font:400 14px/1 var(--head);text-transform:uppercase;letter-spacing:.03em}
.chip-f:hover{color:var(--gold);border-color:var(--gold)}
.chip-f[aria-pressed=true]{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.cmd-count{color:var(--muted)}
.cmd-count b{color:var(--gold)}
.cmd-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.cmd-list li{display:grid;grid-template-columns:minmax(150px,1.1fr) 2fr 110px minmax(150px,1.2fr);gap:14px;align-items:center;padding:12px 16px;border-radius:10px;background:var(--panel);border:1px solid var(--line)}
.cmd-list li[hidden]{display:none}
.cmd-list .cmd-head{background:transparent;border:0;padding:4px 16px;color:var(--dim);font:400 13px/1 var(--head);text-transform:uppercase;letter-spacing:.06em}
.cmd-name{display:grid;gap:3px}
.cmd-name code{justify-self:start;font-size:14px}
.cmd-name small{color:var(--dim);font-size:12px}
.cmd-desc{color:#d6c9b3;font-size:15px}
.cmd-grp{justify-self:start;padding:3px 10px;border-radius:999px;font:400 12px/1.3 var(--head);text-transform:uppercase;letter-spacing:.04em;background:#2c2318;color:var(--muted)}
.g-player{background:#163b1b;color:#9ff5a6}.g-team{background:#3d2a0c;color:var(--gold-2)}.g-mod{background:#45160f;color:#ffaa9d}.g-build{background:#123345;color:#9ddcff}
.cmd-syn{justify-self:start;font-size:12.5px;word-break:break-word}
@media (max-width:860px){.cmd-list .cmd-head{display:none}.cmd-list li{grid-template-columns:1fr auto;gap:8px}.cmd-desc,.cmd-syn{grid-column:1/-1}.cmd-grp{grid-column:2;grid-row:1}}

/* Regeln */
.rule-toc{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px}
.rule-toc a{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:10px;background:var(--panel);border:1px solid var(--line);color:var(--text);font-weight:600}
.rule-toc a b{color:var(--gold);font:400 17px/1 var(--head)}
.rule-toc a:hover{border-color:var(--gold);color:var(--gold)}
.rule-sec{scroll-margin-top:90px}
.rule-sec>summary{display:flex;align-items:center;gap:16px;padding:18px 20px}
.rule-sec>summary>div{flex:1}
.rule-badge{display:grid;place-items:center;flex:none;width:52px;height:52px;border-radius:12px;background:var(--gold);color:var(--ink);font:400 20px/1 var(--head);box-shadow:inset 0 -3px 0 var(--deep)}
.rule-sec h2{font-size:24px;text-transform:uppercase}
.rule-sec summary p{color:var(--muted);font-size:14px}
.rule-list{list-style:none;margin:0;padding:0 20px 20px;display:grid;gap:8px}
.rule-list li{display:grid;grid-template-columns:48px 1fr;gap:12px;padding:12px 14px;border-radius:10px;background:#18140f;border:1px solid var(--line)}
.rule-nr{font:400 16px/1.5 var(--head);color:var(--gold)}
.rule-list p{color:#ddd0bb}
.rule-ok,.rule-no{display:block;margin-top:10px;padding:10px 12px;border-radius:8px;font-size:14px}
.rule-ok{background:#12301a;color:#c6f5cb;border-left:3px solid var(--green)}
.rule-no{background:#3a1410;color:#ffd0c9;border-left:3px solid var(--red)}
@media (max-width:560px){.rule-list li{grid-template-columns:1fr;gap:2px}.rule-sec>summary{padding:14px}.rule-list{padding:0 14px 14px}.rule-badge{width:44px;height:44px}}

/* Team */
.grp{padding:20px 22px}
.grp>header{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:16px}
.grp h2{display:flex;align-items:center;gap:12px;font-size:24px;text-transform:uppercase}
.grp-n{display:grid;place-items:center;min-width:34px;height:34px;padding:0 10px;border-radius:999px;background:#2c2318;color:var(--gold);font:400 16px/1 var(--head)}
.grp-open{padding:4px 12px;border-radius:999px;background:#163b1b;color:#9ff5a6;font:400 12px/1.3 var(--head);text-transform:uppercase;letter-spacing:.04em}
.rank{display:inline-block;padding:4px 14px;border-radius:8px;font:400 20px/1.2 var(--head);text-transform:uppercase;background:#2c2318;color:var(--gold)}
.r-owner{background:linear-gradient(180deg,#ff6a3d,#e0331a);color:#fff;box-shadow:inset 0 -3px 0 #8f1c0c}
.r-admin{background:linear-gradient(180deg,#ff5050,#c41f1f);color:#fff;box-shadow:inset 0 -3px 0 #7a1010}
.staff-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.staff{display:flex;align-items:center;gap:14px;padding:12px;border-radius:12px;background:#18140f;border:1px solid var(--line)}
.staff-avatar{width:56px;height:56px;border-radius:10px;image-rendering:pixelated;background:#2c2318}
.staff h3{font-size:19px}
.staff p{color:var(--muted);font-size:13px}
.grp-empty{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;color:var(--muted)}
.grp .more{display:inline-flex;align-items:center;gap:6px;font:400 15px/1 var(--head);text-transform:uppercase;letter-spacing:.03em}

.mx-donate{display:grid;grid-template-columns:1.2fr 1fr;gap:34px;align-items:center;padding:34px;border-radius:18px;border:3px solid var(--line);background:radial-gradient(70% 90% at 15% 20%,#4a3010 0%,#1f1a14 60%)}
.mx-donate-copy{display:grid;gap:16px;justify-items:start}
.mx-donate h2{font-size:clamp(1.8rem,3.4vw,2.6rem);text-transform:uppercase;color:var(--gold);text-shadow:0 4px 0 #3d1f00}
.mx-donate-copy p{color:#ddd0bb;font-size:17px}
.mx-donate-rules{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.mx-donate-rules li{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:10px;background:#120f0bcc;border:1px solid var(--line);color:var(--muted);font-size:15px}
.mx-donate-rules .ic{color:var(--green);width:20px;height:20px;margin-top:2px;fill:none}
.mx-donate-rules b{color:var(--text)}
.pg-card-ic img{width:30px;height:30px;image-rendering:pixelated}
@media (max-width:800px){.mx-donate{grid-template-columns:1fr;padding:22px}}

/* Dashboard compatibility */
.dash-shell{padding:30px 0 90px}
.dash-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
