/* ── site loader / visitor counter ── self-contained (no shared.css dependency) */
html.agl-loading, html.agl-loading body, html.agl-lock, html.agl-lock body { overflow: hidden !important; }
html.agl-loading::before { content: ''; position: fixed; inset: 0; background: #ffffff; z-index: 9998; }
.agl { position: fixed; inset: 0; z-index: 9999; color: #09090B; display: flex; flex-direction: column; justify-content: space-between; font-family: 'Inter', 'Helvetica Neue', system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
/* gate leaves — two white panels split on a slightly slanted center seam */
.agl::before, .agl::after { content: ''; position: absolute; inset: 0; background: #ffffff; z-index: -1; transition: transform 0.9s cubic-bezier(0.76, 0, 0.24, 1) 0.12s; will-change: transform; }
.agl::before { clip-path: polygon(0 0, 53% 0, 47% 100%, 0 100%); }
.agl::after { clip-path: polygon(52.8% 0, 100% 0, 100% 100%, 46.8% 100%); }
.agl > * { transition: opacity 0.3s ease, transform 0.3s ease; }
.agl.agl-out > * { opacity: 0; transform: translateY(-14px); }
.agl.agl-out::before { transform: translateX(-102%); }
.agl.agl-out::after { transform: translateX(102%); }
.agl-veil { position: fixed; inset: 0; z-index: 9998; }
.agl-veil::before, .agl-veil::after { content: ''; position: absolute; inset: 0; background: #DBFE52; transition: transform 0.85s cubic-bezier(0.76, 0, 0.24, 1) 0.3s; will-change: transform; }
.agl-veil::before { clip-path: polygon(0 0, 53% 0, 47% 100%, 0 100%); }
.agl-veil::after { clip-path: polygon(52.8% 0, 100% 0, 100% 100%, 46.8% 100%); }
.agl-veil.agl-out::before { transform: translateX(-102%); }
.agl-veil.agl-out::after { transform: translateX(102%); }
@keyframes aglIn { from { opacity: 0; transform: translateY(16px); } }
.agl-top { animation: aglIn 0.65s cubic-bezier(0.22, 1, 0.36, 1) 0.08s backwards; }
.agl-bottom { animation: aglIn 0.65s cubic-bezier(0.22, 1, 0.36, 1) 0.2s backwards; }
.agl-mid > * { animation: aglIn 0.65s cubic-bezier(0.22, 1, 0.36, 1) backwards; }
.agl-mid > :nth-child(1) { animation-delay: 0.16s; }
.agl-mid > :nth-child(2) { animation-delay: 0.26s; }
.agl-mid > :nth-child(3) { animation-delay: 0.36s; }
.agl-mono { font: 500 0.62rem/1.4 'JetBrains Mono', ui-monospace, Menlo, monospace; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(9,9,11,0.45); }
.agl-mid .agl-mono { font-size: 29.92px; line-height: 0; }
.agl-top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: clamp(1rem, 2.4vh, 1.6rem) clamp(1rem, 2.6vw, 2rem); border-bottom: 1px solid rgba(9,9,11,0.14); }
.agl-brand { display: inline-flex; align-items: baseline; gap: 0.55rem; font: 800 0.82rem/1 'Inter', sans-serif; letter-spacing: 0.04em; text-transform: uppercase; }
.agl-dot { display: inline-block; width: 8px; height: 8px; background: #DBFE52; transform: translateY(-1px); }
.agl-mid { flex: 1; position: relative; display: grid; place-content: center; justify-items: center; gap: clamp(0.9rem, 2.4vh, 1.5rem); padding: 0 clamp(1rem, 2.6vw, 2rem); text-align: center; }
.agl-mid::after { content: ''; position: absolute; inset: clamp(1.1rem, 3.2vh, 2rem) clamp(1.1rem, 3.2vw, 2rem); pointer-events: none; color: rgba(9,9,11,0.32); background: linear-gradient(to right, currentColor 14px, transparent 14px) top left / 14px 1px no-repeat, linear-gradient(to bottom, currentColor 14px, transparent 14px) top left / 1px 14px no-repeat, linear-gradient(to left, currentColor 14px, transparent 14px) top right / 14px 1px no-repeat, linear-gradient(to bottom, currentColor 14px, transparent 14px) top right / 1px 14px no-repeat, linear-gradient(to right, currentColor 14px, transparent 14px) bottom left / 14px 1px no-repeat, linear-gradient(to top, currentColor 14px, transparent 14px) bottom left / 1px 14px no-repeat, linear-gradient(to left, currentColor 14px, transparent 14px) bottom right / 14px 1px no-repeat, linear-gradient(to top, currentColor 14px, transparent 14px) bottom right / 1px 14px no-repeat; }
.agl-odo { display: flex; align-items: flex-start; font: 900 clamp(3.2rem, 11vw, 8.5rem)/1 'Inter', sans-serif; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.agl-col { display: block; height: 1em; overflow: hidden; }
/* Duration is mirrored by REEL_MS in loader.js — change both together. */
.agl-reel { display: flex; flex-direction: column; transition: transform 0.76s cubic-bezier(0.16, 1, 0.3, 1); }
.agl-reel span { display: block; height: 1em; line-height: 1; }
.agl-col.agl-spin .agl-reel { transition: none; animation: aglSpin 0.9s linear infinite; }
@keyframes aglSpin { to { transform: translateY(-10em); } }
.agl-comma { display: block; line-height: 1; color: rgba(9,9,11,0.30); }
.agl-suf { font-size: 0.32em; font-weight: 800; letter-spacing: -0.01em; line-height: 1; margin-left: 0.1em; padding-top: 0.12em; }
.agl-vfoot { color: rgba(9,9,11,0.36); }
.agl-bottom { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: clamp(0.9rem, 2vh, 1.3rem) clamp(1rem, 2.6vw, 2rem) calc(clamp(0.9rem, 2vh, 1.3rem) + 3px); border-top: 1px solid rgba(9,9,11,0.14); }
.agl-load { display: inline-flex; align-items: baseline; gap: 0.75rem; }
.agl-pct { font: 800 1rem/1 'Inter', sans-serif; letter-spacing: -0.005em; font-variant-numeric: tabular-nums; }
.agl-pct::after { content: ''; display: inline-block; width: 0.42em; height: 0.78em; background: #DBFE52; margin-left: 0.32em; animation: aglBlink 1.1s steps(1) infinite; }
@keyframes aglBlink { 50% { opacity: 0; } }
.agl-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(9,9,11,0.08); }
.agl-fill { position: absolute; inset: 0; background: #DBFE52; transform: scaleX(0); transform-origin: left center; }
@media (prefers-reduced-motion: reduce) { .agl, .agl-veil { transition: opacity 0.3s ease; } .agl.agl-out, .agl-veil.agl-out { opacity: 0; } .agl::before, .agl::after, .agl-veil::before, .agl-veil::after, .agl > * { transition: none; } .agl.agl-out::before, .agl.agl-out::after, .agl-veil.agl-out::before, .agl-veil.agl-out::after { transform: none; } .agl.agl-out > * { transform: none; } .agl-col.agl-spin .agl-reel { animation: none; } .agl-reel { transition: none; } .agl-top, .agl-bottom, .agl-mid > *, .agl-pct::after { animation: none; } }
