Make the resume bilingual and part of the shared site chrome

Adds a Russian version (data/resume.ru.json, default language) with an RU/EN
switch stored under the key shared with the front page and the portfolio.
The top bar becomes the site-wide one (brand, Resume, Portfolio, Gitea,
Contact, language, theme) with a second row of anchors for this page's
sections, and the fonts move to Unbounded and Onest so the three pages share
one type system. Portfolio links now point at /portfolio/.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XtcZtnG4GQA1d6mW5PNrS9

components/TopBar.tsx

@@ -1,27 +1,40 @@
 'use client'
 
+import { Bi, SITE } from '@/lib/i18n'
 import { useScrolled } from '@/lib/useScroll'
-import type { Portfolio } from '@/lib/types'
+import LangSwitch from './LangSwitch'
 import ThemeToggle from './ThemeToggle'
 import styles from './topbar.module.css'
 
-type Props = { name: string; portfolio: Portfolio; showProjects: boolean }
-
-export default function TopBar({ name, portfolio, showProjects }: Readonly<Props>) {
+/** The same bar as on the front page and the portfolio, plus a row of anchors for the sections of this page. */
+export default function TopBar({ showProjects }: Readonly<{ showProjects: boolean }>) {
   const scrolled = useScrolled()
   return (
     <header className={`${styles.bar} ${scrolled ? styles.solid : ''}`}>
       <div className={styles.inner}>
-        <a className={styles.mark} href="#top">{name}</a>
-        <nav className={styles.nav} aria-label="Sections">
-          {showProjects && <a href="#projects">Projects</a>}
-          <a href="#skills">Skills</a>
-          <a href="#experience">Experience</a>
-          <a href="#education">Education</a>
-          <a href="#contact">Contact</a>
+        <a className={styles.brand} href={`${SITE}/`} aria-label="shanaty.ru">
+          <svg viewBox="0 0 100 100" width="30" height="30" aria-hidden="true">
+            <path d="M70 30A20 20 0 1 0 50 50A20 20 0 1 1 30 70" transform="translate(50 50) scale(.78) translate(-50 -50)" fill="none" stroke="currentColor" strokeWidth="13" strokeLinecap="round" />
+            <circle cx="50" cy="50" r="8" fill="var(--y)" />
+          </svg>
+          <span>shanaty.ru</span>
+        </a>
+        <nav className={styles.nav} aria-label="shanaty.ru">
+          <a href={`${SITE}/resume/`} aria-current="page"><Bi ru="Резюме" en="Resume" /></a>
+          <a href={`${SITE}/portfolio/`}><Bi ru="Портфолио" en="Portfolio" /></a>
+          <a href="https://git.shanaty.ru/Emil_Shanaty">Gitea</a>
+          <a href="#contact"><Bi ru="Контакты" en="Contact" /></a>
         </nav>
+        <LangSwitch />
         <ThemeToggle />
-        <a className={styles.cta} href={portfolio.href} target="_blank" rel="noreferrer">{portfolio.label ?? 'Portfolio'}</a>
+      </div>
+      <div className={styles.subwrap}>
+        <nav className={styles.sub} aria-label="Page sections">
+          {showProjects && <a href="#projects"><Bi ru="Проекты" en="Projects" /></a>}
+          <a href="#skills"><Bi ru="Навыки" en="Skills" /></a>
+          <a href="#experience"><Bi ru="Опыт" en="Experience" /></a>
+          <a href="#education"><Bi ru="Образование" en="Education" /></a>
+        </nav>
       </div>
     </header>
   )