@font-face {
  font-family:'Kiwi Soda';
  src:url('../../assets/fonts/kiwi-soda/KiwiSoda.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
/* Kiwi Soda by jeti / Font End Dev, CC BY 4.0.
   https://fontenddev.com/fonts/kiwi-soda/ — font file unmodified. */
:root { color-scheme: dark; --ink:#d9dbe7; --red:#d51d12; --blue:#123e9a; --yellow:#ffd400; --game-font:'Comico',sans-serif; --heading-font:var(--game-font); }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; background:#07090e; }
body { overflow-x:hidden; font-family:Arial,Helvetica,sans-serif; }
.token-page { min-height:100svh; background:radial-gradient(circle at 50% 35%,#263a67 0,#10182b 28%,#07090e 68%); color:var(--ink); }
.token-header,.token-footer { position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; padding:22px clamp(20px,5vw,72px); text-transform:uppercase; letter-spacing:.16em; font-weight:800; }
.mark-link { display:block; width:94px; height:52px; }
.mark-link img { width:100%; height:100%; object-fit:contain; object-position:left center; }
.ticker { color:var(--yellow); font-size:clamp(18px,2vw,30px); text-shadow:2px 2px #b81712; }
.hero { position:relative; display:grid; place-items:center; min-height:clamp(480px,72svh,800px); padding:0 20px; }
.speed-lines { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; opacity:.8; }
.hero-art { width:min(72vw,560px); filter:drop-shadow(0 25px 25px #000b); animation:float 5s ease-in-out infinite; }
.hero-art img { display:block; width:100%; height:auto; }
.hero-rule { position:absolute; left:50%; bottom:22%; width:min(80vw,960px); height:5px; transform:translateX(-50%) skewX(-22deg); background:linear-gradient(90deg,transparent,var(--red) 12%,var(--yellow) 50%,var(--blue) 88%,transparent); opacity:.8; }
h1 { position:absolute; top:-8%; bottom:auto; margin:0; color:var(--yellow); font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif; font-size:clamp(52px,9vw,120px); font-style:italic; letter-spacing:-.05em; line-height:.8; text-shadow:5px 5px var(--red),9px 9px var(--blue),12px 12px #05070d; }
.copy-stack { position:relative; display:grid; gap:clamp(72px,12vw,180px); max-width:1080px; margin:0 auto; padding:clamp(100px,14vw,220px) clamp(24px,6vw,72px); }
.copy-block { max-width:900px; padding:clamp(24px,4vw,48px); background:rgba(0,0,0,.72); color:var(--ink); text-shadow:1px 2px 1px #000,-1px 0 1px #000; }
.copy-block:nth-child(even) { justify-self:end; }
.copy-block h2 { margin:0 0 28px; color:var(--ink); font-family:var(--game-font); font-size:clamp(22px,3vw,36px); font-weight:800; letter-spacing:.1em; line-height:1.1; text-shadow:inherit; }
.copy-block p { max-width:62ch; margin:0 0 18px; color:inherit; font-family:var(--game-font); font-size:clamp(15px,1.7vw,23px); font-weight:700; letter-spacing:.075em; line-height:1.45; }
.copy-block p:nth-of-type(2),.copy-block p:nth-of-type(3) { color:inherit; font-size:clamp(18px,2.2vw,29px); font-weight:800; line-height:1.2; }
.lineup { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,4vw,58px); align-items:end; padding:0 clamp(10px,5vw,72px) 40px; }
.lineup::before { content:""; position:absolute; inset:10% 0 0; background:linear-gradient(180deg,transparent,#06080e); pointer-events:none; }
.lineup figure { position:relative; z-index:1; margin:0; border-top:1px solid #f5edcf55; }
.lineup img { display:block; width:100%; height:auto; mix-blend-mode:screen; }
.gameplay-window { position:relative; min-height:100svh; background:#000; }
.gameplay-frame { position:relative; width:100%; height:100svh; min-height:100svh; overflow:hidden; background:#000; }
.gameplay-frame::before { display:none; }
.gameplay-frame iframe { display:block; width:100%; height:100%; border:0; background:#000; }
.token-footer { border-top:1px solid #f5edcf33; font-size:12px; }
.token-footer > div { display:grid; gap:10px; max-width:720px; }
.token-footer small { display:block; color:#d9dbe799; font-family:var(--game-font); font-size:10px; line-height:1.45; letter-spacing:.08em; }
.token-footer a { color:var(--yellow); font-size:28px; text-decoration:none; }
@keyframes float { 0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)} }
@media (max-width:640px) { .token-header { padding:16px 18px; } .mark-link { width:72px;height:42px; } .hero { min-height:65svh; } .hero-art { width:88vw; } h1 { top:-5%; font-size:16vw; } .hero-rule { bottom:24%; } .copy-stack { gap:88px; padding:96px 14px 120px; } .copy-block { padding:24px 18px; } .copy-block:nth-child(even) { justify-self:start; } .copy-block p { font-size:15px; } .copy-block p:nth-of-type(2),.copy-block p:nth-of-type(3) { font-size:20px; } .lineup { grid-template-columns:1fr; padding-bottom:20px; } .lineup figure:nth-child(2) { margin-top:-12%; } .token-footer { align-items:flex-start; } }
@media (prefers-reduced-motion:reduce) { .hero-art { animation:none; } }

/* Landing-page font trial. Keep the original treatment above for comparison. */
.token-page { font-family:var(--game-font); font-synthesis:none; }
.copy-block, .copy-block:nth-child(even) { justify-self:center; width:100%; text-align:center; }
.copy-block p { margin-inline:auto; }
.token-footer > div { margin-inline:auto; text-align:center; }
.token-header, .token-footer { font-weight:400; letter-spacing:.025em; }
.ticker, .token-footer > div > span { font-family:var(--heading-font); }
.hero h1 { font-family:var(--heading-font); font-weight:400; font-style:normal; letter-spacing:0; line-height:1; }
.copy-block h2 { font-family:var(--heading-font); font-weight:400; font-size:48px; line-height:1.1; letter-spacing:0; text-shadow:0 2px #000; }
.copy-block p,
.copy-block p:nth-of-type(2),
.copy-block p:nth-of-type(3) { font-family:var(--game-font); font-size:clamp(18px,1.8vw,24px); font-weight:400; line-height:1.55; letter-spacing:0; text-shadow:0 1px 1px #000; }
.token-footer small { font-size:12px; letter-spacing:0; line-height:1.6; }
@media (max-width:640px) {
  .copy-block h2 { font-size:32px; }
}