Frontend update

client/src/components/SiteHeader.jsx

@@ -0,0 +1,73 @@
+import { Link } from 'react-router-dom'
+import MoonDot from './MoonDot.jsx'
+
+const NAV = {
+  website: [
+    { label: 'News', to: '/site/news' },
+    { label: 'Screenshots', to: '/site/screenshots' },
+    { label: 'Five on Friday', to: '/site/five-on-friday' },
+    { label: 'Newsletter', to: '/site/newsletter' },
+    { label: 'About', to: '/site/about' },
+    { label: 'Wiki', to: '/wiki' },
+  ],
+  wiki: [
+    { label: 'Website', to: '/site' },
+    { label: 'New Player Guide', to: '/wiki/new-player-guide' },
+    { label: 'Maps & Atlas', to: '/wiki/maps-atlas' },
+    { label: 'Systems', to: '/wiki/systems' },
+    { label: 'Rules', to: '/wiki/rules' },
+  ],
+}
+
+export default function SiteHeader({ section = 'website' }) {
+  const links = NAV[section] || NAV.website
+  return (
+    <header
+      style={{
+        borderBottom: '1px solid var(--line)',
+        background: 'rgba(9,13,18,0.86)',
+        backdropFilter: 'blur(8px)',
+        position: 'sticky',
+        top: 0,
+        zIndex: 30,
+      }}
+    >
+      <div
+        className="shell"
+        style={{
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'space-between',
+          gap: 20,
+          padding: '14px 0',
+          flexWrap: 'wrap',
+        }}
+      >
+        <Link
+          to="/"
+          className="display"
+          style={{
+            display: 'flex',
+            alignItems: 'center',
+            gap: 10,
+            fontSize: '1.2rem',
+            letterSpacing: '0.05em',
+            color: 'var(--accent-bright)',
+            textDecoration: 'none',
+            fontWeight: 600,
+          }}
+        >
+          <MoonDot />
+          UOMysticmoon
+        </Link>
+        <nav style={{ display: 'flex', flexWrap: 'wrap', gap: 8, alignItems: 'center' }}>
+          {links.map((l) => (
+            <Link key={l.to + l.label} to={l.to} className="pill">
+              {l.label}
+            </Link>
+          ))}
+        </nav>
+      </div>
+    </header>
+  )
+}