/* R14 — "Latest Release" ticker. Additive only: loaded after r13.css (untouched); nothing else is restyled.
   A slim cream strip on the very top edge of the header: charcoal mono type, a coral dot, the design name in the display face,
   an OX-blue "Explore →", and the same dotted hairline the sticky header already uses. The header rows below it keep
   their R13 look; only their top offset makes room for the strip (the header row moves by a few px, never onto the hero). */
:root{--tk:24px}
.tick{position:fixed;left:0;right:0;top:0;z-index:61;height:var(--tk);background:var(--cream);color:var(--ink);overflow:hidden;
 border-bottom:1.5px dotted rgba(29,33,36,.28)}
.tick[hidden]{display:none}
.tk-view{height:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent)}
.tk-track{display:flex;height:100%;width:max-content;will-change:transform}
.tk-half{display:flex;height:100%}
.tk-item{display:inline-flex;align-items:center;gap:10px;height:100%;padding:0 34px 0 0;white-space:nowrap;color:var(--ink);text-decoration:none;-webkit-tap-highlight-color:transparent}
.tk-dot{width:6px;height:6px;border-radius:50%;background:var(--red);flex:none}
.tk-k{font:700 .58rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink2)}
.tk-sep{font:700 .7rem/1 var(--mono);color:rgba(29,33,36,.4)}
.tk-n{font:850 .76rem/1 var(--display);font-stretch:86%;letter-spacing:.05em;text-transform:uppercase}
.tk-go{position:relative;font:700 .58rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.tk-go::after{content:"";position:absolute;left:0;right:0;bottom:-4px;border-bottom:2px solid var(--blue);transform:scaleX(.35);transform-origin:0 50%;transition:transform .2s cubic-bezier(.3,.7,.2,1)}
@media (hover:hover){.tk-item:hover .tk-go::after{transform:scaleX(1)}.tk-item:hover .tk-n{text-decoration:none}}
.tk-item:focus-visible{outline:2px dashed var(--ink);outline-offset:-4px}
.tk-item:focus-visible .tk-go::after{transform:scaleX(1)}
/* reduced motion: one static, centred message */
.tick.static .tk-view{-webkit-mask-image:none;mask-image:none}
.tick.static .tk-track{width:100%;justify-content:center}
.tick.static .tk-item{padding:0 16px;max-width:100%;overflow:hidden}
.tick.static .tk-n{overflow:hidden;text-overflow:ellipsis;min-width:0}

/* the header sits directly under the strip. At the top of the page its row keeps (almost) its R13 position:
   the strip takes the place of the header's own top padding. Sticky state stays compact. */
.has-tick .nav{top:var(--tk);padding-top:max(0px,calc(clamp(12px,1.6vw,22px) - var(--tk)))}
.has-tick .nav.stuck{padding-top:5px;padding-bottom:6px}
/* Archive row reached from the ticker: a short OX-blue confirmation (same line the hover uses) */
.ai.tk-hit::before{transform:scaleX(1)}

@media (max-width:899px),(orientation:portrait) and (max-width:1100px){
 :root{--tk:22px}
 .tk-item{gap:8px;padding-right:26px}
 .tk-k,.tk-go{font-size:.52rem;letter-spacing:.12em}
 .tk-n{font-size:.68rem}
 .tk-dot{width:5px;height:5px}
 .tk-view{-webkit-mask-image:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 18px),transparent);mask-image:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 18px),transparent)}
 .has-tick .nav{padding-top:0;padding-bottom:10px}
 .has-tick .nav.stuck{padding-top:4px;padding-bottom:6px}
}
@media (prefers-reduced-motion:reduce){.tk-go::after{transition:none}}
