:root {
  --pc-ink: #1c1917;
  --pc-paper: #fafaf9;
  --pc-amber: #fbbf24;
  --pc-line: #d6d3d1;
  --pc-muted: #57534e;
  --pc-ok: #047857;
  --pc-warn: #b45309;
  --pc-bad: #b91c1c;
}

.pc-skip {
  position: fixed;
  left: 1rem;
  top: -5rem;
  z-index: 10000;
  background: #fff;
  color: var(--pc-ink);
  border: 2px solid var(--pc-ink);
  padding: .7rem 1rem;
  font: 700 .9rem/1.2 system-ui, sans-serif;
}
.pc-skip:focus { top: 1rem; }

.pc-nav {
  position: relative;
  z-index: 9999;
  background: var(--pc-ink);
  color: #fff;
  border-bottom: 3px solid var(--pc-amber);
  font: 600 .78rem/1.2 system-ui, sans-serif;
}
.pc-nav-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: .55rem 1rem;
  display: flex;
  align-items: center;
  gap: .5rem;
  overflow-x: auto;
  scrollbar-width: thin;
}
.pc-brand {
  color: var(--pc-amber);
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
  margin-right: .35rem;
}
.pc-nav a:not(.pc-brand) {
  color: #e7e5e4;
  text-decoration: none;
  padding: .45rem .55rem;
  border: 1px solid transparent;
  white-space: nowrap;
}
.pc-nav a:hover,
.pc-nav a:focus-visible,
.pc-nav a[aria-current="page"] {
  color: #fff;
  border-color: #78716c;
  background: #292524;
  outline: none;
}
.pc-nav a[aria-current="page"] { color: var(--pc-amber); }
.pc-project-pill {
  margin-left: auto;
  color: #d6d3d1;
  white-space: nowrap;
  font-weight: 500;
}

.pc-alert {
  position: relative;
  z-index: 9998;
  padding: .8rem 1rem;
  border-bottom: 2px solid;
  font: 600 .86rem/1.4 system-ui, sans-serif;
  text-align: center;
}
.pc-alert.bad { background: #fef2f2; color: var(--pc-bad); border-color: #fecaca; }
.pc-alert.warn { background: #fffbeb; color: #92400e; border-color: #fde68a; }

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #2563eb !important;
  outline-offset: 2px !important;
}

@media (max-width: 720px) {
  .pc-nav-inner { padding: .45rem .65rem; }
  .pc-project-pill { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
