:root{--bg:#06101d;--bg2:#0a1627;--panel:#0c192b;--panel2:#10213a;--text:#f7f9ff;--muted:#a9b8cc;--line:#203654;--cyan:#18c9ff;--blue:#3677ff;--purple:#7c55ff;--pink:#e62be7;--green:#45e0b7;--amber:#f9bd55;--radius:20px;--shadow:0 24px 80px rgba(0,0,0,.42)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 80% 5%,rgba(60,107,255,.11),transparent 28%),radial-gradient(circle at 15% 30%,rgba(230,43,231,.07),transparent 25%),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.58}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.container{width:min(1220px,calc(100% - 38px));margin:auto}.skip-link{position:absolute;left:-999px;top:8px;background:#fff;color:#000;padding:8px 12px;z-index:99}.skip-link:focus{left:8px}.site-header{position:sticky;top:0;z-index:50;background:rgba(5,13,25,.9);border-bottom:1px solid rgba(105,145,196,.16);backdrop-filter:blur(18px)}.nav{height:82px;display:flex;align-items:center;gap:24px}.brand{display:flex;align-items:center;gap:10px;min-width:max-content}.brand img{width:113px;height:auto}.brand-copy{display:flex;flex-direction:column;line-height:.95}.brand-copy b{font-size:20px;letter-spacing:.045em}.brand-copy b span{background:linear-gradient(90deg,var(--cyan),var(--purple),var(--pink));-webkit-background-clip:text;color:transparent}.brand-copy small{font-size:7.5px;letter-spacing:.29em;color:#a9b6ca;margin-top:7px}.navlinks{display:flex;align-items:center;gap:18px;margin-left:auto;font-size:13px;color:#d7e0ed}.navlinks a{position:relative;padding:31px 0}.navlinks a:hover,.navlinks a[aria-current="page"]{color:#fff}.navlinks a[aria-current="page"]:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:9px;background:linear-gradient(90deg,var(--cyan),var(--purple))}.nav-actions{display:flex;align-items:center;gap:10px}.menu-btn{display:none;background:#0b1829;border:1px solid var(--line);color:#fff;border-radius:12px;padding:9px 12px;min-height:44px;min-width:44px}[hidden]{display:none!important}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:14px;padding:13px 20px;font-family:inherit;font-size:16px;font-weight:800;border:1px solid var(--line);transition:.18s}.btn:hover{transform:translateY(-2px);border-color:#55779f}.btn-primary{border:0;background:linear-gradient(90deg,#ef25e4,#7659ff,#11c7ff);box-shadow:0 12px 34px rgba(81,79,255,.24)}.btn-soft{background:rgba(8,18,33,.76)}/* Header CTA. The full-size button pulled the eye away from the navigation it sits beside, which is the wrong emphasis for a link people use once. */.btn-sm{padding:9px 15px;font-size:13px;border-radius:12px;font-weight:700}.eyebrow{text-transform:uppercase;letter-spacing:.3em;font-weight:800;font-size:11px;color:#91a8ff}.gradient{background:linear-gradient(90deg,var(--cyan),var(--blue),var(--purple),var(--pink));-webkit-background-clip:text;color:transparent}.hero{min-height:650px;position:relative;overflow:hidden;background:#07111f}.hero-bg{position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(5,12,23,.99) 0%,rgba(5,12,23,.94) 36%,rgba(5,12,23,.45) 58%,rgba(5,12,23,.08) 100%),url('/images/hero-world.webp');background-size:cover;background-position:center}.hero-bg:after{content:"";position:absolute;inset:auto 0 0;height:180px;background:linear-gradient(transparent,var(--bg))}.hero-inner{position:relative;z-index:2;padding:100px 0 135px;max-width:650px}/* text-wrap:balance evens out the lines of a hero heading. It is here because
   the launchpad hero was leaving "THE" orphaned on a line of its own at 375px.
   A non-breaking space fixed the orphan but pushed the heading 17px past its
   box; balance fixed it with no overflow and no font change, and improved
   games/whitepaper/about for free while leaving the rest identical. Measured,
   not guessed — don't remove it without re-measuring those pages at 375px. */
.hero h1,.page-hero h1{font-size:clamp(48px,7vw,88px);line-height:.92;letter-spacing:-.055em;text-transform:uppercase;text-wrap:balance;margin:20px 0}.hero p,.page-hero p{font-size:18px;color:#c7d2e1;max-width:650px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.micro-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:-74px;position:relative;z-index:4}.micro{padding:20px 18px;border-top:1px solid #324968;background:rgba(7,16,29,.9);backdrop-filter:blur(10px)}.micro b{display:block;font-size:14px;text-transform:uppercase;letter-spacing:.04em}.micro span{display:block;color:var(--muted);font-size:12px;margin-top:2px}.section{padding:78px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:28px}.section h2{font-size:clamp(30px,4vw,50px);line-height:1.02;margin:7px 0;letter-spacing:-.04em}.section-lead{color:var(--muted);max-width:730px}.three-grid,.four-grid,.two-grid{display:grid;gap:18px}.three-grid{grid-template-columns:repeat(3,1fr)}.four-grid{grid-template-columns:repeat(4,1fr)}.two-grid{grid-template-columns:repeat(2,1fr)}.glass{background:linear-gradient(145deg,rgba(15,31,53,.94),rgba(7,17,31,.94));border:1px solid rgba(100,136,183,.2);border-radius:var(--radius);box-shadow:var(--shadow)}.feature-card{padding:27px;min-height:260px;position:relative;overflow:hidden}.feature-card:before{content:"";position:absolute;width:170px;height:170px;border-radius:50%;filter:blur(70px);opacity:.2;right:-60px;top:-60px;background:var(--purple)}.feature-icon{width:46px;height:46px;border-radius:14px;background:#091629;border:1px solid #355073;display:grid;place-items:center;font-size:22px}.feature-card h3{font-size:22px;margin:21px 0 7px}.feature-card p,.content-card p,.content-card li{color:var(--muted)}.text-link{color:var(--cyan);font-weight:800}.game-link{margin-top:14px}.game-link a:hover{text-decoration:underline}.game-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.game-card{border-radius:19px;overflow:hidden;border:1px solid rgba(101,141,193,.24);background:#0a1525;box-shadow:var(--shadow)}.game-card .shot{height:210px;overflow:hidden;position:relative}.game-card .shot img{width:100%;height:100%;object-fit:cover}.game-card .shot:after{content:"";position:absolute;inset:auto 0 0;height:70px;background:linear-gradient(transparent,#0a1525)}.game-copy{padding:19px}.game-copy h3{font-size:27px;margin:0 0 4px}.game-copy p{color:var(--muted);min-height:50px}.tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}.tag,.pill{font-size:10px;border-radius:999px;padding:5px 9px;border:1px solid #314a69;background:rgba(8,17,30,.74)}.pill{display:inline-flex;color:#8ae5ff;border-color:rgba(22,198,255,.34);background:rgba(22,198,255,.09);text-transform:uppercase;letter-spacing:.1em}.page-hero{padding:92px 0 60px;position:relative;overflow:hidden;background:linear-gradient(90deg,#07111f 0%,#07111f 50%,rgba(7,17,31,.3)),var(--hero) center right/cover no-repeat}.page-hero:after{content:"";position:absolute;inset:auto 0 0;height:90px;background:linear-gradient(transparent,var(--bg))}.page-hero .container{position:relative;z-index:2}.page-hero h1{font-size:clamp(48px,6vw,75px);max-width:760px}.content-card{padding:29px}.content-card h3{font-size:22px;margin:0 0 8px}.content-card h4{margin-bottom:5px}.metric{padding:25px}.metric b{font-size:30px;display:block}.metric span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}.notice{border:1px solid rgba(249,189,85,.3);background:rgba(249,189,85,.08);color:#e2cfa9;border-radius:15px;padding:16px 18px}.good{border-color:rgba(69,224,183,.28);background:rgba(69,224,183,.07);color:#bce9dc}.timeline{display:grid;gap:12px}.timeline-item{display:grid;grid-template-columns:110px 1fr;gap:15px;padding:19px;border:1px solid var(--line);border-radius:15px;background:#091526}.timeline-item strong{color:#91e9ff}.data-table{width:100%;border-collapse:collapse;overflow:hidden}.data-table th,.data-table td{padding:14px 13px;border-bottom:1px solid #1c304a;text-align:left}.data-table th{font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:#8fa4bf}.node-map{min-height:390px;display:grid;place-items:center;position:relative;overflow:hidden}.ring{width:270px;height:270px;border:1px solid #3f6290;border-radius:50%;position:relative;box-shadow:0 0 90px rgba(53,100,255,.18),inset 0 0 50px rgba(19,198,255,.08)}.ring:before,.ring:after{content:"";position:absolute;border-radius:50%;border:1px dashed rgba(108,149,206,.4);inset:35px}.ring:after{inset:82px;border-style:solid}.node-center{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:92px;height:92px;border-radius:26px;background:#0d1f37;display:grid;place-items:center;font-weight:900;font-size:26px;border:1px solid #5277a3}.dot{position:absolute;width:14px;height:14px;border-radius:50%;background:var(--cyan);box-shadow:0 0 20px var(--cyan)}.d1{left:2px;top:120px}.d2{right:30px;top:48px;background:var(--pink);box-shadow:0 0 20px var(--pink)}.d3{right:8px;bottom:73px;background:var(--purple)}.d4{left:55px;bottom:6px;background:var(--green)}.cta-band{padding:40px;border:1px solid #334b6c;border-radius:24px;background:linear-gradient(120deg,rgba(28,75,126,.42),rgba(111,49,168,.35));display:flex;align-items:center;justify-content:space-between;gap:20px}.footer{border-top:1px solid rgba(112,148,194,.16);background:#050b14;padding:44px 0 25px;margin-top:45px}.footer-grid{display:grid;grid-template-columns:1.35fr repeat(3,.7fr);gap:30px}.footer h4{margin:0 0 12px}.footer a{display:block;color:#9cacbf;margin:7px 0}.footer a:hover{color:#fff}.footer-bottom{margin-top:30px;padding-top:20px;border-top:1px solid #17283f;display:flex;justify-content:space-between;gap:20px;color:#74869f;font-size:12px}.faq details{border:1px solid #1e3653;background:#081525;border-radius:14px;padding:15px 18px;margin:10px 0}.faq summary{font-weight:800;cursor:pointer}.faq details p{color:var(--muted)}.steps{counter-reset:s;display:grid;gap:13px}.step{counter-increment:s;display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start}.step:before{content:counter(s);width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--blue),var(--purple));display:grid;place-items:center;font-weight:900}.center{text-align:center}.legal{max-width:900px}.legal h2{margin-top:38px;font-size:28px}.legal p,.legal li{color:var(--muted)}@media(max-width:980px){.navlinks{display:none;position:absolute;top:82px;left:0;right:0;padding:20px;background:#07111f;border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start}.navlinks.open{display:flex}.navlinks a{padding:5px 0}.menu-btn{display:block}.nav-actions .btn{display:none}.game-grid,.three-grid{grid-template-columns:1fr 1fr}.four-grid{grid-template-columns:1fr 1fr}.micro-row{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr 1fr}.two-grid{grid-template-columns:1fr}.page-hero{background-position:70% center}.hero-bg{background-position:62% center}}
/* service/feature checklist — shared, originally inline on nodes.html */
.node-service-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}.node-service{padding:14px 15px;border:1px solid #243d5c;border-radius:13px;background:#081526;color:#d7e7f7;font-size:13px}.node-service::before{content:"\2713";margin-right:8px;color:#43e4be;font-weight:900}
/* The same list, meaning the opposite. Used where a list states what is NOT
   offered — a green tick against "Matchmaking" reads as a feature, which is the
   inverse of the point. Muted, with a cross rather than a tick. */
.node-service-list.is-excluded .node-service{border-color:#33405a;background:#0a1220;color:#93a3ba}
.node-service-list.is-excluded .node-service::before{content:"\00d7";color:#7b8aa3}
@media(max-width:1180px){.navlinks{display:none;position:absolute;top:82px;left:0;right:0;padding:20px;background:#07111f;border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start}.navlinks.open{display:flex}.navlinks a{padding:5px 0}.menu-btn{display:block}.nav-actions .btn{display:none}}@media(max-width:640px){.node-service-list{grid-template-columns:1fr}.container{width:min(100% - 26px,1220px)}.brand img{width:89px}.brand-copy b{font-size:17px}.brand-copy small{display:none}.nav{height:68px}.navlinks{top:68px}.hero{min-height:610px}.hero-inner{padding:76px 0 140px}.hero h1{font-size:51px}.hero p,.page-hero p{font-size:16px}.hero-bg{background-image:linear-gradient(90deg,rgba(5,12,23,.96),rgba(5,12,23,.64)),url('/images/hero-world-m.webp');background-position:60% center}.micro-row,.game-grid,.three-grid,.four-grid{grid-template-columns:1fr}.section{padding:58px 0}.section-head,.cta-band,.footer-bottom{display:block}.cta-band .btn{margin-top:18px}.game-card .shot{height:190px}.footer-grid{grid-template-columns:1fr}.timeline-item{grid-template-columns:1fr}.page-hero{padding-top:70px;background-image:linear-gradient(90deg,#07111f 0%,#07111f 50%,rgba(7,17,31,.3)),var(--hero-m,var(--hero))}.data-table{font-size:13px}.data-table th,.data-table td{padding:10px 8px}}

/* Contract/wallet address listings. Shared because token.html, members.html and
   transparency.html all publish addresses; word-break is what stops a 42-character
   hex string forcing horizontal scroll. */
.addr{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:#8fe9ff;word-break:break-all}
.contracts{display:grid;grid-template-columns:180px 1fr;gap:9px 16px;font-size:12.5px;align-items:center}
.contracts span{color:#93a8c2;text-transform:uppercase;letter-spacing:.09em;font-size:10px}
@media(max-width:640px){.contracts{grid-template-columns:1fr;gap:4px 0}.contracts span{margin-top:8px}}

/* Very narrow phones (320px, e.g. iPhone SE 1st gen).
   .brand carries min-width:max-content so it does not wrap at desktop, but that
   also stops it shrinking, which pushed the Menu button 9px off-screen on every
   page. And the token allocation table is wider than 320px, taking the whole
   page 47px wide with it.
   Scoped to 380px because at 375px the table fits by compressing its cells,
   which reads better than an internally scrolling table. The page body must
   never scroll horizontally; wide tables scroll inside themselves instead. */
@media(max-width:380px){
  /* A hero heading cannot scroll, so a word wider than the container is simply
     cut off and unreachable. On nodes.html "ecosystem." ran 18px past the box
     at the size these headings otherwise take. Capping them here keeps the
     longest word on every page inside its container with room to spare. */
  .hero h1,.page-hero h1{font-size:44px}
  .brand{min-width:0}
  /* min-width:0 lets the brand box shrink, but its text then overflows the box
     and sits 2px from the Menu button — not overlapping, but one font change
     away from it. Taking the wordmark from 17px to 15px on the narrowest
     phones restores a proper gap without hiding anything. */
  .brand-copy b{font-size:15px}
  .data-table{display:block;overflow-x:auto}
  /* Grid items default to min-width:auto, so they refuse to shrink below their
     own min-content width and push the track wider than the container. A card
     holding a wide table therefore drags the whole page sideways even though the
     table itself scrolls. Same footgun as .brand above. */
  .two-grid>*,.three-grid>*,.four-grid>*,.m-grid>*,.node-roadmap>*{min-width:0}
}

/* Simple marked list for "what exists / what does not" style panels. In the
   shared sheet from the start: the last two list-ish classes were defined in one
   page's inline <style> and rendered unstyled the moment they were reused. */
.tick-list{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:9px}
.tick-list li{position:relative;padding-left:20px;color:var(--muted);line-height:1.55}
.tick-list li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;border-radius:50%;background:var(--cyan);opacity:.85}

/* Screen-reader-only label. Used where a control already carries its own visible
   placeholder, so a repeated visible label would be noise — but assistive tech
   still needs the association. Was referenced by two labels before it existed,
   which simply left them visible. */
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* Members page network switcher. The selected network must be visible at all
   times: this page previously rendered testnet figures with nothing saying so. */
.net-pick-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:18px 0 12px}
.net-pick-label{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#8fa4bf}
.net-pick{display:inline-flex;gap:4px;padding:3px;border:1px solid var(--line);border-radius:11px;background:#08131f}
.net-btn{font:inherit;font-size:12px;cursor:pointer;border:0;border-radius:8px;padding:7px 13px;
  background:transparent;color:var(--muted);transition:.15s}
.net-btn:hover{color:#fff}
.net-btn.is-on{background:#16294a;color:#fff;font-weight:700}
.net-btn:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.net-name{font-size:12px;color:var(--dim,#6e839e)}