@font-face { font-family: 'Mono'; src: url('/assets/mono.woff2') format('woff2'); font-display: swap; }
      @font-face { font-family: 'EntryCab'; src: url('/assets/cabinet-800.woff2') format('woff2'); font-weight: 800; font-display: swap; }
      html, body { background: #090b0e; }
      #loader { position: fixed; inset: 0; z-index: 2147483000; overflow: hidden; background-color: #090b0e; color: #ebf3ec; font-family: 'Mono', ui-monospace, Menlo, monospace; -webkit-font-smoothing: antialiased;
        transition: background-color 0.8s ease; }
      #loader canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; opacity: 0; transition: opacity 0.6s ease; will-change: opacity; }
      #loader canvas.on { opacity: 1; }
      /* the rods fade themselves out as they pay out; this backstop runs on the compositor, so it holds even if the page's thread is busy */
      #loader.out canvas { animation: ld-cv-out 0.4s ease 0.5s forwards; }
      @keyframes ld-cv-out { to { opacity: 0; } }
      #loader .ld-c { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; gap: 22px;
        transition: opacity 0.65s ease, filter 0.65s ease, transform 1s cubic-bezier(0.16, 1, 0.3, 1); }
      /* the wordmark pulls into focus with the replay: two channels, ember and
         steel, split along the payout diagonal, converge as --p reaches 1 while a
         sheen crosses the letters */
      #loader .ld-wr { position: relative; }
      #loader .ld-w, #loader .ld-wh { padding: 0 0.06em; font-family: 'EntryCab', 'Cabinet Grotesk', system-ui, sans-serif; font-weight: 800;
        font-size: clamp(60px, 11vw, 168px); line-height: 0.92; letter-spacing: -0.045em; white-space: nowrap; }
      /* a dark halo cut to the letters keeps the bars behind them from fighting the word */
      #loader .ld-wh { position: absolute; inset: 0; color: rgba(9, 11, 14, 0.8); filter: blur(22px); }
      #loader .ld-w { --u: calc(1 - var(--p, 0)); position: relative; color: transparent;
        background: linear-gradient(104deg, #8c867c 0%, #ebf3ec 24%, #ffffff 33%, #cfc7b9 42%, #ebf3ec 56%, #fff3e8 66%, #ebf3ec 78%, #a39c91 100%);
        background-size: 260% 100%; background-position: calc(100% - var(--p, 0) * 100%) 0; -webkit-background-clip: text; background-clip: text;
        filter: blur(calc(var(--u) * 10px)); opacity: calc(0.3 + var(--p, 0) * 0.7);
        text-shadow: calc(var(--u) * -9px) calc(var(--u) * 13px) 0 rgba(93, 230, 164, calc(var(--u) * 0.85)), calc(var(--u) * 9px) calc(var(--u) * -13px) 0 rgba(137, 186, 166, calc(var(--u) * 0.85)); }
      #loader .ld-r { display: flex; align-items: center; gap: 14px; padding: 6px 10px; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: #8a857c; white-space: nowrap; background: rgba(9, 11, 14, 0.72); }
      #loader .ld-replay { display: flex; align-items: center; gap: inherit; }
      #loader .ld-r b { font-weight: 400; color: #ebf3ec; font-variant-numeric: tabular-nums; min-width: 9ch; text-align: left; }
      #loader .ld-bar { position: relative; width: 56px; height: 1px; background: rgba(237, 231, 219, 0.14); }
      #loader .ld-bar i { position: absolute; inset: 0; transform-origin: 0 50%; transform: scaleX(var(--p, 0)); background: #5de6a4; box-shadow: 0 0 8px rgba(93, 230, 164, 0.8); }
      #loader .ld-k { position: absolute; display: flex; align-items: center; gap: 9px; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: #6f6a62; white-space: nowrap; transition: opacity 0.3s ease; }
      #loader .ld-k b { font-weight: 400; color: #ebf3ec; font-variant-numeric: tabular-nums; }
      #loader .ld-tl { top: 28px; left: 32px; } #loader .ld-tr { top: 28px; right: 32px; }
      #loader .ld-bl { bottom: 28px; left: 32px; gap: 16px; } #loader .ld-br { bottom: 28px; right: 32px; }
      #loader .ld-sw { display: inline-flex; align-items: center; gap: 7px; }
      #loader .ld-sw::before { content: ''; width: 9px; height: 3px; background: var(--c); transform: skewX(-34deg); }
      #loader .ld-dot { position: relative; width: 6px; height: 6px; border-radius: 50%; background: #5de6a4; box-shadow: 0 0 8px #5de6a4; }
      #loader .ld-dot::after { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 1px solid #5de6a4; animation: ld-ping 1.6s ease-out infinite; }
      @keyframes ld-ping { from { transform: scale(1); opacity: 0.9; } to { transform: scale(3.2); opacity: 0; } }
      #loader.out .ld-c { opacity: 0; filter: blur(10px); transform: translate(-50%, -50%) scale(1.04); }
      #loader.out .ld-k { opacity: 0; }
      #loader.open { background-color: rgba(9, 11, 14, 0); pointer-events: none; }
      #loader.rm-out { transition: opacity 0.35s ease; opacity: 0; pointer-events: none; }
      /* The finished replay waits for the site; this HUD never reports a percent. */
      #loader .ld-head { display: flex; align-items: center; gap: 9px; }
      #loader .ld-status { display: none; align-items: center; gap: 9px; color: #ebf3ec; }
      #loader.holding .ld-replay, #loader.startup-issue .ld-replay { display: none; }
      #loader.holding .ld-status, #loader.startup-issue .ld-status { display: flex; }
      #loader .ld-status-dot { width: 5px; height: 5px; border-radius: 50%; background: #5de6a4; animation: ld-wait 1.6s ease-in-out infinite; }
      @keyframes ld-wait { 0%,100% { opacity: .4; } 50% { opacity: 1; } }
      #loader .ld-retry { display: none; border: 1px solid #ebf3ec66; border-radius: 5px; padding: 9px 12px; background: #090b0e; color: #ebf3ec; font: 11px 'Mono', monospace; letter-spacing: 0; text-transform: none; cursor: pointer; white-space: nowrap; }
      #loader.startup-issue .ld-retry { display: block; }
      #loader .ld-retry:focus-visible { outline: 2px solid #5de6a4; outline-offset: 3px; }
      @media (prefers-reduced-motion: reduce) { #loader .ld-status-dot, #loader .ld-dot::after { animation: none; } }
      @media (max-width: 680px) {
        #loader .ld-tl, #loader .ld-tr { top: 20px; } #loader .ld-bl, #loader .ld-br { bottom: 22px; }
        #loader .ld-tl, #loader .ld-bl { left: 18px; } #loader .ld-tr, #loader .ld-br { right: 18px; }
        #loader .ld-bl { bottom: 46px; gap: 12px; font-size: 10px; } #loader .ld-tl i { display: none; }
        #loader .ld-r { font-size: 10px; gap: 10px; }
      }

html.is-loading{overflow:hidden}html.is-loading .hero .reveal{opacity:0;transform:translateY(25px);filter:blur(5px)}