/* --- All your original styles --- */
    :root {
      --blue: #00b4fa;
      --blue-dark: #004aad;
      --sand: #e7d7b6;
      --digital-font: 'Share Tech Mono', monospace;
      --highlight-bg: linear-gradient(100deg, #111a33 0%, #1b344a 98%);
      --highlight-border: 2.5px solid #00b4fa;
      --highlight-shadow: 0 2px 32px #00b4fa33, 0 0 0 4px #191a2433;
      --pink: #ff6ad5;
      --purple: #b621fe;
      --gray: #e6e6e6;
    }
    html, body {
      min-height: 100%;
      margin: 0;
      padding: 0;
      background: url('https://e1.pxfuel.com/desktop-wallpaper/767/930/desktop-wallpaper-printed-circuit-board-video-motherboard-blue-and-purple-digital-circuit-board-background.jpg') no-repeat center center fixed;
      background-size: cover;
      background-attachment: fixed;
      color: #fff;
      font-family: var(--digital-font), monospace;
    }
    body::before {
      content: "";
      position: fixed;
      top:0; left:0; right:0; bottom:0;
      background: linear-gradient(115deg, #0c0c10bb 0%, #191a24b7 90%);
      z-index: 0;
      pointer-events: none;
      opacity: 0.85;
      mix-blend-mode: multiply;
    }
    header {
      width: 100%;
      background: rgba(23, 22, 22, 0.98);
      box-shadow: 0 2px 18px #00b4fa44;
      z-index: 100;
      display: flex;
      justify-content: flex-start;
      align-items: center;
      padding: 18px 3vw;
      min-height: 62px;
      position: sticky; top: 0;
    }
    nav {
      display: flex;
      gap: 18px;
      width: 100%;
      align-items: center;
    }
    nav a {
      color: var(--blue);
      font-weight: 700;
      text-decoration: none;
      font-size: 1rem;
      border-radius: 7px;
      padding: 10px 16px;
      letter-spacing: 0.6px;
      background: none;
      transition: background .16s, color .16s;
    }
    nav a:hover {
      background: var(--sand);
      color: #222;
    }
    .hamburger {
      display: none;
      position: absolute;
      right: 24px;
      top: 15px;
      background: none;
      border: none;
      color: var(--blue);
      font-size: 2.4rem;
      cursor: pointer;
      z-index: 201;
    }
    .mobile-nav-overlay {
      display: none;
      position: fixed;
      top: 0; left: 0; width: 100vw; height: 100vh;
      background: rgba(16,20,34,0.98);
      z-index: 2000;
      flex-direction: column;
      align-items: flex-start;
      transition: opacity 0.2s;
    }
    .mobile-nav-overlay.active { display: flex !important; }
    .mobile-nav {
      display: flex;
      flex-direction: column;
      width: 100vw;
      margin-top: 90px;
      gap: 8px;
    }
    .mobile-nav a {
      color: var(--blue);
      background: none;
      text-align: left;
      font-size: 1.33rem;
      padding: 20px 28px;
      border-radius: 0;
      width: 100%;
      display: block;
      border-bottom: 1px solid #203860;
      font-weight: 700;
      letter-spacing: 0.7px;
      transition: background 0.14s, color 0.14s;
    }
    .mobile-nav a:last-child { border-bottom: none;}
    .mobile-nav a:hover { background: var(--sand); color: var(--blue-dark);}
    .mobile-nav-close {
      position: absolute;
      right: 32px; top: 18px;
      background: none;
      border: none;
      font-size: 2.8rem;
      color: var(--blue);
      cursor: pointer;
      z-index: 2200;
    }
    @media (max-width: 950px) {
      nav { display: none; }
      .hamburger { display: block; }
    }
    #tokenomics {
      background: var(--highlight-bg);
      border: var(--highlight-border);
      box-shadow: var(--highlight-shadow);
      border-radius: 18px;
      margin: 54px auto;
      padding: 36px 24px;
      max-width: 970px;
      position: relative;
      z-index: 2;
      font-family: var(--digital-font), monospace;
      color: #fff;
    }
    .tokenomics-title {
      text-align: center;
      margin-bottom: 36px;
      font-size: 2.3rem;
      letter-spacing: 2.2px;
      font-family: var(--digital-font), monospace;
      font-weight: bold;
      text-transform: uppercase;
      background: linear-gradient(92deg, #fff 15%, #00b4fa 65%, #23e6ff 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      text-shadow: 0 2px 18px #00b4fa90, 0 0 16px #23e6ff80;
      filter: brightness(1.23) drop-shadow(0 0 3px #00e6ffbb);
    }
    .tokenomics-grid {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 38px;
      margin-bottom: 18px;
      justify-content: space-between;
    }
    .tokenomics-info {
      flex: 2;
      min-width: 190px;
      font-size: 1.14rem;
      color: var(--sand);
      font-family: var(--digital-font), monospace;
      display: flex;
      flex-direction: column;
      gap: 15px;
    }
    .tokenomics-block {
      margin-bottom: 0;
      font-weight: bold;
      border: 2.5px solid #00b4fa;
      border-radius: 15px;
      background: linear-gradient(98deg, #151b2d 60%, #1d2e49 100%);
      box-shadow: 0 2px 18px #00b4fa25;
      padding: 16px 23px 14px 22px;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      font-size: 1.16em;
      letter-spacing: 0.8px;
      margin-bottom: 15px;
    }
    .tokenomics-block .headline {
      color: #fff;
      font-size: 1.05em;
      font-weight: bold;
      letter-spacing: 1.1px;
      margin-bottom: 6px;
      text-shadow: 0 2px 10px #20284880;
      text-transform: uppercase;
    }
    .tokenomics-block .content {
      font-size: 1.19em;
      color: #00b4fa;
      font-weight: 900;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.6em;
      min-height: 25px;
    }
    .tokenomics-block .subvalue {
      font-size: 0.92em;
      color: #ffb0f9;
      font-weight: bold;
      margin-left: 4px;
      margin-right: 9px;
    }
    .tokenomics-block .x-multiplier {
      font-size: 1.08em;
      color: #ff6ad5;
      font-weight: bold;
      margin-left: 8px;
    }
    .tokenomics-block a {
      color: #ff6ad5;
      font-size: 1.14em;
      margin-left: 7px;
      text-decoration: underline;
      margin-top: 4px;
    }
    .tokenomics-chart-container {
      flex: 1;
      min-width: 180px;
      display: flex;
      justify-content: center;
      align-items: center;
      background: rgba(25, 30, 45, 0.5);
      border-radius: 50%;
      padding: 16px;
      position: relative;
      width: 300px;
      height: 300px;
      max-width: 340px;
      max-height: 340px;
    }
    #tokenomicsChart {
      z-index: 2;
    }
    .chart-logo-center {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 82px;
      height: 82px;
      transform: translate(-50%, -50%);
      border-radius: 50%;
      background: #101622cc;
      border: 2.7px solid #00b4fa99;
      box-shadow: 0 4px 22px #00b4fa44, 0 0 0 6px #2227;
      z-index: 10;
      object-fit: contain;
      pointer-events: none;
    }
    @media (max-width: 900px) {
      .tokenomics-grid { flex-direction: column; gap: 24px; }
      .tokenomics-chart-container { margin-bottom: 16px; width: 220px; height: 220px; }
      .chart-logo-center { width: 58px; height: 58px;}
      .tokenomics-block { font-size: 1.05em; padding: 10px 9px 10px 11px; }
    }
    @media (max-width: 550px) {
      #tokenomics { padding: 19px 2vw 22px 2vw; }
      .tokenomics-title { font-size: 1.33rem;}
      .tokenomics-chart-container { width: 130px; height: 130px; padding: 4px;}
      .chart-logo-center { width: 34px; height: 34px;}
      .tokenomics-block { font-size: .98em; padding: 6px 5px 8px 7px; }
      .tokenomics-info { font-size: 0.98rem; gap: 9px;}
    }
    .tokenomics-details {
      margin-top: 30px;
      display: flex;
      flex-wrap: wrap;
      gap: 26px;
      justify-content: center;
    }
    .tokenomics-percent {
      background: linear-gradient(93deg, #1d243b 60%, #233052 100%);
      border: 1.8px solid #00b4fa44;
      border-radius: 13px;
      box-shadow: 0 2px 18px #00b4fa18;
      padding: 20px 20px 17px 20px;
      min-width: 210px;
      max-width: 410px;
      color: #fff;
      font-size: 1.09rem;
      margin-bottom: 10px;
      font-family: var(--digital-font), monospace;
      letter-spacing: 0.5px;
    }
    .tokenomics-percent b {
      color: #ff6ad5;
      font-size: 1.4em;
      margin-right: 6px;
    }
    @media (max-width: 900px) {
      .tokenomics-details { flex-direction: column; align-items: center; gap: 15px; }
    }
    footer {
      text-align: center;
      color: var(--blue-dark);
      background: #181a1b;
      padding: 24px 8px 19px 8px;
      font-size: 1.09em;
      border-top: 1.5px solid #00b4fa11;
      margin-top: 64px;
      letter-spacing: 1px;
      font-family: var(--digital-font), monospace;
      font-weight: bold;
    }