/* Home label behind the corner flyby mark (Taylor 2026-11-09). Shared by every page that carries the flyby mark, so a page
   built from the observer.html shell gets it by keeping the link. On hover (pointer devices) and keyboard focus, the word
   "Home" slides out from behind the mark and one band of light crosses it, the same sheen as the home preview and the
   Connect tagline (900 ms, champagne band). It slides back without the sheen. Decorative: the link's name stays aria-label
   "Home", so the word is aria-hidden. Reduced motion: it appears in place, no slide, no sheen. */
.top .home{ position:relative; }   /* the label is placed from the mark, whatever else the page sets */
.top .home .hm-lbl{ position:absolute; left:34px; top:0; bottom:0; display:flex; align-items:center; padding-left:8px; overflow:hidden; pointer-events:none; }
.top .home .hm-lbl span{ display:block; font-family:'IBM Plex Sans',system-ui,sans-serif; font-size:15px; line-height:1.3; color:var(--text); white-space:nowrap;
  transform:translateX(calc(-100% - 10px)); opacity:0; transition:transform .24s cubic-bezier(.4,0,.6,1), opacity .18s linear; --pvl:#E9C68A; }
html[data-theme="light"] .top .home .hm-lbl span{ --pvl:#C9923F; }
@media (hover:hover){ .top .home:hover .hm-lbl span{ transform:none; opacity:1; transition:transform .42s cubic-bezier(.22,.8,.3,1), opacity .16s linear;
  color:transparent; background:linear-gradient(100deg, var(--text) 0 38%, var(--pvl) 50%, var(--text) 62% 100%) 100% 0 / 260% 100% no-repeat;
  -webkit-background-clip:text; background-clip:text; animation:hmSheen .9s cubic-bezier(.37,.1,.33,.95) .1s both; } }
.top .home:focus-visible .hm-lbl span{ transform:none; opacity:1; transition:transform .42s cubic-bezier(.22,.8,.3,1), opacity .16s linear;
  color:transparent; background:linear-gradient(100deg, var(--text) 0 38%, var(--pvl) 50%, var(--text) 62% 100%) 100% 0 / 260% 100% no-repeat;
  -webkit-background-clip:text; background-clip:text; animation:hmSheen .9s cubic-bezier(.37,.1,.33,.95) .1s both; }
@keyframes hmSheen{ from{ background-position:100% 0; } to{ background-position:0 0; } }
@media (prefers-reduced-motion: reduce){ .top .home .hm-lbl span, .top .home:hover .hm-lbl span, .top .home:focus-visible .hm-lbl span{ transform:none; transition:opacity .01s; animation:none; color:var(--text); background:none; } }
@media (forced-colors: active){ .top .home:hover .hm-lbl span, .top .home:focus-visible .hm-lbl span{ color:CanvasText; background:none; animation:none; } }
/* Illumination (Taylor 2026-11-09): while the label is out, the amber wash from the home page's header controls lights the
   mark and the word together, from the top edge down. One wash on every page; on the home page it replaces the mark's own
   44 px wash so the two do not stack. Fades in with the slide, out with the return. */
.top .home::after{ display:none !important; }
.top .home::before{ content:''; position:absolute; left:0; right:-46px; top:calc(-1 * max(20px,env(safe-area-inset-top,0px))); bottom:-16px; pointer-events:none; z-index:-1;
  background:linear-gradient(to top, rgba(232,161,92,0) 0%, rgba(232,161,92,.10) 42%, rgba(232,161,92,.30) calc(100% - 4px), rgba(255,224,188,.82) calc(100% - 1px));
  opacity:0; transition:opacity .2s ease-in; }
@media (hover:hover){ .top .home:hover::before{ opacity:1; transition:opacity .3s ease-out; } }
.top .home:focus-visible::before{ opacity:1; transition:opacity .3s ease-out; }
@media (prefers-reduced-motion: reduce){ .top .home::before{ transition:none !important; } }
@media (forced-colors: active){ .top .home::before{ display:none; } }
