/* Shared keyboard access and the visual missing-page route. */
.skip-link { position: fixed; top: 10px; left: 10px; z-index: 1000; padding: 13px 20px; transform: translateY(-180%); background: var(--surface); border: 2px solid var(--accent); color: var(--text); font: 600 16px/1.5 var(--font-body); }
.skip-link:focus { transform: none; }
#main-content { scroll-margin-top: 83px; }
#main-content:focus { outline: none; }
.primary-navigation { min-width: 0; }
.main-menu a { display: inline-block; min-height: 32px; padding-top: 4px; padding-bottom: 4px; }
.site-footer .footer-tagline { margin-top: 16px; }
.error-hero { min-height: calc(100svh - 83px); display: grid; align-items: center; padding: 76px 0; }
.error-layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; gap: 60px; }
.error-copy h1 { font-size: clamp(44px, 5.3vw, 76px); line-height: 1.05; }
.error-copy .title-accent { color: var(--accent); font-style: normal; }
.error-copy .page-lead { max-width: 550px; }
.error-contact { display: inline-block; margin-top: 30px; }
.error-visual { margin: 0; border: 1px solid var(--line); background: var(--paper); }
.error-visual svg { display: block; width: 100%; height: auto; }
.error-visual figcaption { padding: 17px 22px; border-top: 1px solid var(--line); color: var(--muted); font: 500 12px/1.6 var(--font-code); }
.error-visual path, .error-visual rect, .error-visual circle { vector-effect: non-scaling-stroke; }
.error-grid { stroke: var(--line); fill: none; stroke-width: .7; opacity: .45; }
.error-window { fill: var(--surface); stroke: var(--text); stroke-width: 1.5; }
.error-panel { fill: var(--panel); }
.error-line { stroke: var(--muted); fill: none; stroke-width: 1.5; }
.error-red { fill: var(--red); }
.error-muted { fill: var(--muted); }
.error-route { stroke: var(--accent); stroke-width: 2.2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.error-broken { stroke: var(--red-text); stroke-width: 3; fill: none; stroke-linecap: round; }
.error-accent { fill: var(--accent); }
.error-destination { fill: var(--panel); stroke: var(--accent); stroke-width: 1.5; }
.error-icon { stroke: var(--accent); stroke-width: 1.5; fill: none; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 1050px) { .main-menu a { min-height: 44px; padding: 8px 0; } }
@media (max-width: 850px) { .error-layout { grid-template-columns: 1fr; gap: 36px; } .error-visual { max-width: 540px; } }
@media (max-width: 560px) { .error-hero { padding: 48px 0; } .error-copy h1 { font-size: clamp(36px, 10vw, 48px); } .error-visual figcaption { padding: 14px 16px; font-size: 11px; } }