/* A single, bounded first entrance. The page remains ordinary HTML without JS. */
[data-enter] { translate: 0 var(--entry-y, 0px); }
.entry-pending [data-enter] { opacity: 0; --entry-y: 12px; }

/* Ink outside / Paper inside stays visible on both light and dark surfaces.
   Keep outlines immediate, including programmatic step focus. */
body[data-page] :where(a, button, input, textarea, select, summary, [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: 2px solid var(--synk-ink, #292320);
  outline-offset: 5px;
  box-shadow: 0 0 0 5px var(--synk-paper, #fbf7f0);
}
body[data-page] :is(.company-note, .site-footer, .request-card, dialog) :focus-visible,
body[data-page="letter"] :where(a, button, input, textarea, select, summary, [tabindex]:not([tabindex="-1"])):focus-visible {
  outline-color: var(--synk-stitch, #cdbba7);
  box-shadow: 0 0 0 5px var(--synk-ink-deep, #080605);
}
body[data-page] :is(.skip, .skip-link):focus-visible { z-index: 200; }

@media (prefers-reduced-motion: reduce) {
  [data-enter], .entry-pending [data-enter] { opacity: 1 !important; translate: none !important; }
}
@media (forced-colors: active) {
  body[data-page] :focus-visible { outline: 2px solid Highlight !important; box-shadow:none !important; }
}
@media print {
  [data-enter], .entry-pending [data-enter] { opacity:1 !important; translate:none !important; }
}