@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');
:root{--bg:#101a11;--panel:#1b2b1b;--green:#80c64b;--light:#e8f5d9;--line:#49683c}*{box-sizing:border-box}html{min-height:100%}body{margin:0;background:repeating-linear-gradient(0deg,#111d13 0 40px,#142116 40px 80px);color:var(--light);font-family:Arial,Helvetica,sans-serif;min-height:100vh;padding:44px 20px}.frame{max-width:950px;margin:auto;border:5px solid #45643a;box-shadow:0 0 0 5px #0a100a,12px 12px 0 #090f09;background:var(--panel)}.topline{padding:17px 25px;font:10px 'Press Start 2P',monospace;letter-spacing:1px;background:#263c25;border-bottom:5px solid #101b10;display:flex;align-items:center;gap:13px}.square{width:12px;height:12px;background:var(--green);box-shadow:3px 3px 0 #406b2e}.status{margin-left:auto;color:#a7dd78}.hero{height:370px;position:relative;overflow:hidden;background:linear-gradient(#659db2 0%,#a9d5bb 70%,#c0d2a0 100%);isolation:isolate}.pixel-sun{position:absolute;right:12%;top:45px;width:64px;height:64px;background:#f5e8a0;box-shadow:0 0 0 12px #f5e8a044}.mountains{position:absolute;inset:60px 0 48px;background:#547e69;clip-path:polygon(0 77%,9% 60%,18% 70%,29% 25%,41% 65%,52% 43%,62% 68%,77% 14%,91% 63%,100% 50%,100% 100%,0 100%);opacity:.8}.grass{position:absolute;bottom:42px;height:42px;width:100%;background:repeating-linear-gradient(90deg,#5c9e39 0 48px,#72b744 48px 96px);border-top:12px solid #86c650}.dirt{position:absolute;bottom:0;width:100%;height:43px;background:repeating-linear-gradient(90deg,#62432b 0 28px,#795334 28px 58px,#4f3929 58px 80px)}.hero-content{position:absolute;inset:0 15px 70px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;text-shadow:5px 5px 0 #203420}.eyebrow,.subhead{font:11px/1.9 'Press Start 2P',monospace;color:white}.eyebrow{margin-bottom:18px}h1{font:clamp(27px,6.3vw,65px)/1.3 'Press Start 2P',monospace;margin:0 0 19px;color:#e9ffe1;letter-spacing:-2px;-webkit-text-stroke:1px #284627}h1 span{color:#a8e55c}.subhead{font-size:clamp(8px,1.35vw,12px);background:#203c27c9;padding:12px}.details{padding:37px 46px 45px}.label{color:#a0d66f;font:11px 'Press Start 2P',monospace;margin-bottom:24px}.details p{font-size:20px;line-height:1.65;max-width:720px;margin:0 0 28px}.details strong{color:#b5eb88}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:32px 0}.tile{min-height:118px;background:#2b4428;border:3px solid #63884b;box-shadow:5px 5px 0 #101a11;display:flex;align-items:center;gap:16px;padding:18px;font:10px/1.8 'Press Start 2P',monospace}.tile-icon{font:37px Arial;color:#a4dc70}.details .coming{font:13px/2 'Press Start 2P',monospace;color:#e8f5d9;margin:36px 0 23px}.contact{display:inline-flex;gap:14px;align-items:center;text-decoration:none;color:#132410;background:#9bd76a;padding:19px 21px;border:3px solid #d2f3b0;box-shadow:5px 5px 0 #080e08;font:11px/1.7 'Press Start 2P',monospace;max-width:100%;overflow-wrap:anywhere}.contact:hover,.contact:focus-visible{background:#c3f19b;transform:translate(2px,2px);box-shadow:3px 3px 0 #080e08}.arrow{margin-left:10px}footer{border-top:5px solid #101b10;background:#263c25;padding:24px 28px;display:flex;justify-content:space-between;gap:20px;font:10px/1.7 'Press Start 2P',monospace;color:#9dc58b}footer strong{color:#e8f5d9}@media(max-width:700px){body{padding:16px 10px}.topline{font-size:8px;padding:15px 12px}.hero{height:310px}.details{padding:27px 20px 34px}.details p{font-size:17px}.tiles{grid-template-columns:1fr}.tile{min-height:75px}.contact{font-size:9px;padding:14px 11px}footer{flex-direction:column;font-size:9px;padding:20px}}

/* Multi-page navigation and reading layouts */
a{color:#b5eb88;text-underline-offset:4px}nav{display:flex;flex-wrap:wrap;gap:10px;padding:18px 24px;background:#172617;border-bottom:4px solid #101b10}nav a,.button{display:inline-block;padding:14px 18px;border:2px solid #63884b;background:#2b4428;color:#e8f5d9;text-decoration:none;font:11px/1.6 'Press Start 2P',monospace;box-shadow:3px 3px #0a100a}nav a[aria-current=page],.button{background:#9bd76a;color:#132410;border-color:#d2f3b0}a:focus-visible{outline:3px solid #f5e8a0;outline-offset:5px}nav a:hover,.button:hover{background:#c3f19b;color:#132410}.page-brand{padding:30px 46px;background:#263c25;font:24px/1.6 'Press Start 2P',monospace}.page-brand a{text-decoration:none;color:#e8f5d9}.page-brand span{color:#a8e55c}.page-title{font:clamp(22px,4vw,36px)/1.5 Arial,Helvetica,sans-serif;letter-spacing:0;text-shadow:none;-webkit-text-stroke:0;margin:0 0 25px;color:#e8f5d9}.details h2:not(.page-title){font-size:25px;line-height:1.4;margin:35px 0 14px;color:#b5eb88}.details h3{font-size:21px;margin:28px 0 12px}.details .lead{font-size:25px;color:#d4efb5}.notice{padding:24px;border:2px solid #63884b;background:#243c25;margin:26px 0}.notice p{margin:14px 0 20px}.notice p:last-child{margin-bottom:0}.tiles a{text-decoration:none}.rules{padding-left:24px}.rules li{font-size:18px;line-height:1.75;margin-bottom:22px;padding-left:6px}code{font-size:.9em;background:#101b10;padding:2px 5px;overflow-wrap:anywhere}.details .small{font-size:15px;line-height:1.7;margin-top:14px}.video{aspect-ratio:16/9;background:#101b10;border:3px solid #49683c}.video iframe{width:100%;height:100%;border:0}.highway-placeholder{margin:32px 0;padding:40px 24px;text-align:center;border:3px dashed #63884b;background:repeating-linear-gradient(45deg,#203520 0 18px,#263d25 18px 36px)}.highway-placeholder div{font-size:55px;color:#a4dc70}.highway-placeholder figcaption{font:12px/2 'Press Start 2P',monospace}.highway-placeholder span{display:block;font:17px/1.7 Arial;margin-top:12px}footer{display:block}footer>a{display:block;margin-top:20px;font:15px/1.6 Arial}footer small{display:block;font:13px/1.6 Arial;margin-top:14px}.launch-clock{text-align:center;display:grid;gap:18px;padding:8px 0 28px;border-bottom:2px solid #49683c}.launch-clock strong{font:clamp(17px,3.3vw,29px)/1.6 'Press Start 2P',monospace;font-variant-numeric:tabular-nums}.launch-clock>span:last-of-type{font:14px/1.6 Arial}.footer-line{display:flex;justify-content:space-between;gap:20px;margin-top:25px}.skip{position:absolute;left:16px;top:-100px;z-index:10;padding:15px;background:#e8f5d9;color:#101a11}.skip:focus{top:10px}@media(max-width:700px){nav{padding:14px 12px;gap:9px}nav a{font-size:9px;padding:12px}.page-brand{padding:24px 20px;font-size:20px}.notice{padding:18px}.button{font-size:10px;max-width:100%}.footer-line{flex-direction:column}.details .lead{font-size:22px}.rules li{font-size:17px}.launch-clock{gap:13px}.topline{letter-spacing:0}}

.closing-motto{text-align:center;margin-top:26px;color:#e8f5d9;font:10px/1.8 'Press Start 2P',monospace}.hero-content .subhead{max-width:100%;font-size:clamp(8px,1.25vw,11px);line-height:2}

.highway-map{margin:32px 0}.highway-map img{display:block;width:100%;height:auto;border:3px solid #63884b}.highway-map figcaption{font:15px/1.7 Arial,Helvetica,sans-serif;color:#c4d9b7;margin-top:12px}

/* Responsive layout: readable copy, comfortable touch targets, no clipped content. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:20px}
.frame,main,nav,.details,.notice,.tile,.launch-clock{min-width:0}
img,iframe{max-width:100%}
.details p,.rules li,.notice,footer{overflow-wrap:anywhere}
nav a,.button,.tile{touch-action:manipulation}
nav a,.button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;text-align:center}
.video iframe{display:block}
.highway-map a{display:block;touch-action:manipulation}
.highway-map a:focus-visible{outline-offset:4px}
.launch-clock strong{white-space:normal}
@media(max-width:700px){
 body{padding:12px 12px 20px}
 .frame{border-width:3px;box-shadow:0 0 0 3px #0a100a,5px 5px 0 #090f09}
 .topline{padding:14px 12px;gap:10px;font:700 11px/1.5 Arial,Helvetica,sans-serif;letter-spacing:1px}
 .square{flex:0 0 10px;width:10px;height:10px}
 .status{text-align:right;letter-spacing:0}
 nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));padding:12px;gap:10px}
 nav a{grid-column:span 2;font:700 15px/1.4 Arial,Helvetica,sans-serif;padding:12px 6px;min-width:0}
 nav a:nth-last-child(-n+2){grid-column:span 3}
 .hero{height:280px}
 .hero-content{inset:0 12px 76px;text-shadow:3px 3px 0 #203420}
 .hero h1{font-size:clamp(22px,6.4vw,43px);letter-spacing:-1px;line-height:1.5;margin-bottom:14px}
 .eyebrow{font-size:10px;margin-bottom:12px}
 .hero-content .subhead{font:700 15px/1.6 Arial,Helvetica,sans-serif;padding:10px 12px;max-width:340px;text-shadow:1px 2px #203420}
 .pixel-sun{width:48px;height:48px;top:28px;right:10%}
 .details{padding:26px clamp(16px,4.5vw,30px) 32px}
 .label{font-size:10px;line-height:1.8;margin-bottom:18px}
 .page-title{font-size:28px;line-height:1.25;margin-bottom:22px}
 .page-brand{font-size:clamp(17px,4.8vw,24px);padding:22px 18px}
 .details p,.rules li{font-size:17px;line-height:1.7}
 .details p{margin-bottom:22px}
 .details h2:not(.page-title){font-size:24px;margin-top:30px}
 .details h3{font-size:20px;line-height:1.4}
 .notice{padding:18px 16px;margin:24px 0;line-height:1.65}
 .notice>strong{font-size:18px;line-height:1.5}
 .button{font:700 16px/1.4 Arial,Helvetica,sans-serif;padding:13px 18px;width:100%;max-width:360px}
 .tiles{gap:12px;margin:24px 0}
 .tile{min-height:72px;font-size:11px;padding:16px 18px}
 .rules{padding-left:22px;margin-top:0}
 .rules li{padding-left:3px;margin-bottom:24px}
 code{box-decoration-break:clone;-webkit-box-decoration-break:clone}
 .highway-map{margin:26px -6px}
 .highway-map figcaption{font-size:14px;padding:0 6px}
 .details .small{font-size:15px}
 footer{padding:24px 16px;font-size:10px}
 footer>a{min-height:44px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:16px}
 footer small{font-size:14px;line-height:1.65}
 .launch-clock{gap:14px;padding-bottom:22px}
 .launch-clock strong{font-size:clamp(13px,3.5vw,23px);letter-spacing:-.3px}
 .footer-line{margin-top:22px;text-align:center;align-items:center}
 .closing-motto{padding:8px 0;margin-top:18px;line-height:2}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Keep the navigation visible while the content below scrolls. */
.frame>header{position:sticky;top:0;z-index:20;background:#172617;box-shadow:0 4px 0 #101b10}
html{scroll-padding-top:180px}
@media(max-width:700px){html{scroll-padding-top:210px}}

/* Shared live header timer, compact on phones. */
.topline{font:700 13px/1.5 Arial,Helvetica,sans-serif;letter-spacing:.3px}
.server-label{min-width:0}
.status{display:grid;gap:3px;text-align:right;flex-shrink:0;letter-spacing:0;font:12px/1.4 Arial,Helvetica,sans-serif}
.status strong{color:#e8f5d9;font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap}
@media(max-width:700px){
 .topline{gap:8px;padding:12px 10px;align-items:center;font-size:12px;letter-spacing:0}
 .server-label{max-width:145px}
 .status{font-size:10px;gap:2px}
 .status strong{font-size:11px}
 .square{flex-basis:8px;width:8px;height:8px}
 html{scroll-padding-top:230px}
}

.crossplay{padding:18px 20px;border-left:4px solid #9bd76a;background:#243c25}
.software{margin-top:40px;padding-top:8px;border-top:2px solid #49683c}
.software-list{display:grid;grid-template-columns:minmax(140px,1fr) minmax(0,2fr);font-size:17px;line-height:1.7;margin:24px 0}
.software-list dt,.software-list dd{padding:14px 0;border-bottom:1px solid #49683c;margin:0;overflow-wrap:anywhere}
.software-list dt{font-weight:bold;color:#b5eb88;padding-right:20px}
@media(max-width:700px){.crossplay{padding:16px}.software-list{display:block;font-size:16px}.software-list dt{border-bottom:0;padding:16px 0 3px}.software-list dd{padding:0 0 16px}}

.footer-contact{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 10px;margin-top:20px;text-align:center;font:15px/1.6 Arial,Helvetica,sans-serif}.footer-contact a{display:inline-flex;align-items:center;min-height:44px;overflow-wrap:anywhere}@media(max-width:700px){.footer-contact{flex-direction:column;gap:0;font-size:15px}.footer-contact a{font-size:16px}}

/* Alliance 4 logo in the shared header. */
.header-logo{display:block;width:36px;height:36px;flex:0 0 36px;object-fit:contain;border-radius:50%}
@media(max-width:700px){.header-logo{width:28px;height:28px;flex-basis:28px}}

/* World screenshot beside the highway introduction. */
.world-highway{margin:0 0 36px;max-width:100%;border:3px solid var(--line);background:#142116;box-shadow:5px 5px 0 #0a100a}
.world-highway img{display:block;width:100%;max-width:100%;height:auto}
.world-highway figcaption{padding:14px 16px;border-top:3px solid var(--line);color:var(--light);font:15px/1.6 Arial,Helvetica,sans-serif}
@media(max-width:700px){.world-highway{margin-bottom:28px}.world-highway figcaption{padding:12px;font-size:14px}}
