:root { --site-bg: #0d0a1f; --site-ink: #f5f3ff; --site-muted: #b7b1cb; --site-line: #ffffff24; --site-accent: #ad8cff; }
* { box-sizing: border-box; } html { scroll-behavior: smooth; } body { margin: 0; background: var(--site-bg); color: var(--site-ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; } a { color: inherit; text-decoration: none; }
.wrap { width: min(1120px, calc(100% - 40px)); margin: 0 auto; }.site-header { position: sticky; top: 0; z-index: 300; border-bottom: 1px solid var(--site-line); background: #0d0a1fe8; backdrop-filter: blur(14px); }.site-nav { display: flex; min-height: 68px; align-items: center; justify-content: space-between; gap: 24px; }.brand { flex: none; font-size: 1.08rem; font-weight: 850; letter-spacing: .09em; }.brand span { color: var(--site-accent); }.site-nav nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 7px 18px; color: var(--site-muted); font-size: .86rem; }.site-nav nav a:hover { color: var(--site-ink); }.site-nav nav a[aria-current="page"] { color: var(--site-ink); font-weight: 750; }.site-footer { padding: 29px 0 38px; border-top: 1px solid var(--site-line); color: #908aa5; font-size: .8rem; }
@media (max-width: 700px) { .wrap { width: min(100% - 32px, 1120px); }.site-nav { min-height: 0; padding: 14px 0; align-items: flex-start; }.site-nav nav { gap: 7px 13px; justify-content: flex-start; } }