/* PATCH — shared base: tokens, nav, footer. Same palette as the iOS app (Theme.swift). */
:root {
  --bg: #080808; --bg2: #0f0f0f; --bg3: #161616; --border: #1e1e1e;
  --dim2: #4a4a44; --dim1: #888880; --fg: #e2e2d8; --red: #c0392b;
  --mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: var(--bg); color: var(--fg); font: 14px/1.6 var(--mono); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
.wrap { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.label { font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: var(--dim1); }
.dim { color: var(--dim1); }
.grid-bg {
  background-image:
    linear-gradient(var(--border) 1px, transparent 1px),
    linear-gradient(90deg, var(--border) 1px, transparent 1px);
  background-size: 112px 112px;
  background-position: center top;
}

nav { position: sticky; top: 0; z-index: 10; background: rgba(8,8,8,.86); backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); }
nav .wrap { display: flex; align-items: center; height: 64px; gap: 32px; }
.brand { display: flex; align-items: center; gap: 14px; font-weight: 700; letter-spacing: .35em; font-size: 13px; }
.brand img { width: 26px; height: 34px; }
.nav-links { display: flex; gap: 28px; margin-left: auto; }
.nav-links a { font-size: 10px; letter-spacing: .25em; color: var(--dim1); transition: color .2s; }
.nav-links a:hover, .nav-links a[aria-current] { color: var(--fg); }

footer { padding: 48px 0 64px; }
footer .wrap { display: flex; gap: 24px; align-items: center; flex-wrap: wrap; }
footer .links { display: flex; gap: 24px; margin-left: auto; }
footer a, footer span { font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--dim1); }
footer a:hover { color: var(--fg); }
footer img { width: 18px; height: 24px; display: block; }

@media (max-width: 600px) {
  .wrap { padding: 0 16px; }
  nav .wrap { gap: 16px; }
  .nav-links { gap: 16px; }
  .nav-links a.opt { display: none; }
  footer .links { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) { * { animation: none !important; } }
[hidden] { display: none !important; }