Why doesn't the onClick action add a value to an existing integer

I am using ReactJS + Vite and Tailwind CSS and I'm trying to add 150 to the int "tokens" in a button (located in navbar), but I can't get it to work. Can anyoone help me? It is very simplyfied (using components in navbar.jsx and in main.jsx

Navbar.jsx (loaded into main.jsx)

import { Link } from "react-router-dom";
import React, { useState } from 'react';

var tokens = 100;
export default function Navbar() {
  return (
    <div>
      <nav class="bg-slate-800 text-gray-200 h-14 flex items-center rounded-cool flex-row mb-1.5 ">
        {/* tokens */}
          <div class="basis-1/3 flex flex-row justify-end">
            <div class="bg-slate-700 hover:bg-gray-700 transition-all divide-x py-1.5 px-2 mr-2 ml-1 box-content rounded-cool flex flex-row">
              <button class="pr-1.5 hover:text-orange-500
              transition-all" onClick={()=>tokens+=100}>Add Tokens</button>              
               <p
               class="px-1.5 hover:text-orange-500 
               transition-all"
               >
                 {tokens} Tokens
              </p>
            </div>
          </div>

      </nav>
    </div>
  );
}

main.jsx (or

//import of libraries
import { render } from "react-dom";
import { BrowserRouter, Routes, Route,} from "react-router-dom";

//css (TailWind)
import './index.css'

//imports of pages
import App from "./App";
import Cases from "./routes/cases";
import Upgrader from "./routes/upgrader";
import Contracts from "./routes/contracts";
import Inventory from "./routes/inventory";
import Navbar from "./navbar"

//site content
const rootElement = document.getElementById("root");
render(
  <BrowserRouter>
  <Navbar/>
    <Routes>
      <Route path="/" element={<App />} />
      <Route path="cases" element={<Cases />} />
      <Route path="upgrader" element={<Upgrader />} />
      <Route path="contracts" element={<Contracts />} />
      <Route path="inventory" element={<Inventory />} />
    </Routes>
  </BrowserRouter>,
  rootElement
);