/* Transitions.dev — Spinning counter, adapted for a hanging arcade sign. */
:root{--reel-dur:1400ms;--reel-cell:30px;--reel-stagger:90ms;--reel-ease:cubic-bezier(0.16,1,0.3,1)}
.visitor-rig{position:absolute;left:0;top:0;width:1487px;height:1058px;transform-origin:0 0;pointer-events:none;z-index:1}
/* Preserve depth toward the doorway while keeping both suspension chains plumb. */
.visitor-mount{position:absolute;left:14px;top:var(--visitor-top,145px);width:290px;height:163px;transform:perspective(600px) rotateY(20deg) scale(.9);transform-origin:0 0}
.visitor-sign{position:absolute;top:0;left:0;width:290px;aspect-ratio:640/360;transform:translateY(-150%);transform-origin:50% 0;pointer-events:none;transition:transform 950ms cubic-bezier(.22,1.3,.4,1);filter:drop-shadow(0 10px 12px #0009)}
.visitor-sign[hidden]{display:none}.visitor-sign.arrived{transform:translateY(0)}
.visitor-sign>img{width:100%;height:100%;display:block}
.visitor-lettering{position:absolute;left:17.5%;top:34.17%;width:65%;height:40.83%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#f0ce84;text-shadow:0 0 9px #e49a383d;gap:2px}
.visitor-lettering small{font:700 9px/1.3 'Courier New',monospace;letter-spacing:.2em}
.visitor-lettering .visitor-welcome{font:9px/1.3 'Courier New',monospace;letter-spacing:.12em;color:#bba479}
.t-reel{display:inline-flex;align-items:center;height:var(--reel-cell);font:700 27px/1 'Courier New',monospace;font-variant-numeric:tabular-nums;letter-spacing:.08em}
.t-reel-col{position:relative;height:var(--reel-cell);overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 22%,#000 78%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0%,#000 22%,#000 78%,transparent 100%)}
.t-reel-strip{display:flex;flex-direction:column;will-change:transform}
.t-reel-digit{height:var(--reel-cell);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.approaching .visitor-sign{opacity:0}
@media(prefers-reduced-motion:reduce){.visitor-sign{transition:none;transform:translateY(0)}.t-reel-strip{transition:none!important;filter:none!important}}

.visitor-extension{position:absolute;top:calc(24px - var(--visitor-top,145px));height:calc(var(--visitor-top,145px) - 24px);width:11px;overflow:hidden;filter:drop-shadow(1px 1px 2px #0008)}
.visitor-extension-left{left:51px}.visitor-extension-right{left:228px}
.visitor-extension span{display:block;height:28px;background-image:url('assets/visitor-sign.webp');background-size:290px 163.125px;background-position:-51px 0}
.visitor-extension-right span{background-position:-228px 0}