  <style>
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --bg: #0a0a0a;
      --yellow: #f5e642;
      --white: #f0ede6;
      --gray: #2a2a2a;
      --stripe: repeating-linear-gradient(
        -45deg,
        #f5e642 0px, #f5e642 20px,
        #0a0a0a 20px, #0a0a0a 40px
      );
    }

    html, body {
      height: 100%;
      background: var(--bg);
      color: var(--white);
      font-family: 'DM Mono', monospace;
      overflow: hidden;
    }

    /* Animated noise grain */
    body::before {
      content: '';
      position: fixed;
      inset: 0;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
      opacity: 0.04;
      pointer-events: none;
      z-index: 100;
    }

    .stripe-top, .stripe-bottom {
      position: fixed;
      left: 0; right: 0;
      height: 28px;
      background: var(--stripe);
      z-index: 10;
    }
    .stripe-top { top: 0; }
    .stripe-bottom { bottom: 0; }

    .stripe-left, .stripe-right {
      position: fixed;
      top: 0; bottom: 0;
      width: 28px;
      background: var(--stripe);
      z-index: 10;
    }
    .stripe-left { left: 0; }
    .stripe-right { right: 0; }

    .scene {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      height: 100%;
      padding: 60px;
      position: relative;
    }

    .tag {
      font-family: 'DM Mono', monospace;
      font-size: 0.7rem;
      letter-spacing: 0.25em;
      color: var(--yellow);
      text-transform: uppercase;
      margin-bottom: 2rem;
      opacity: 0;
      animation: fadeUp 0.6s ease forwards 0.2s;
    }

    .title {
      font-family: 'Bebas Neue', sans-serif;
      font-size: clamp(5rem, 15vw, 13rem);
      line-height: 0.9;
      text-align: center;
      letter-spacing: 0.02em;
      color: var(--white);
      opacity: 0;
      animation: fadeUp 0.7s ease forwards 0.4s;
    }

    .title span {
      color: var(--yellow);
      display: block;
    }

    .divider {
      width: 60px;
      height: 2px;
      background: var(--yellow);
      margin: 2.5rem auto;
      opacity: 0;
      animation: expand 0.6s ease forwards 0.8s;
      transform-origin: left;
    }

    .subtitle {
      font-size: 0.78rem;
      letter-spacing: 0.15em;
      color: #888;
      text-align: center;
      max-width: 380px;
      line-height: 1.9;
      text-transform: uppercase;
      opacity: 0;
      animation: fadeUp 0.6s ease forwards 1s;
    }

    .counter-row {
      display: flex;
      gap: 3rem;
      margin-top: 3.5rem;
      opacity: 0;
      animation: fadeUp 0.6s ease forwards 1.2s;
    }

    .counter-block {
      text-align: center;
    }

    .counter-num {
      font-family: 'Bebas Neue', sans-serif;
      font-size: 2.8rem;
      color: var(--yellow);
      line-height: 1;
    }

    .counter-label {
      font-size: 0.62rem;
      letter-spacing: 0.2em;
      color: #555;
      text-transform: uppercase;
      margin-top: 0.3rem;
    }

    .gear {
      position: fixed;
      opacity: 0.06;
      font-size: 18rem;
      pointer-events: none;
      animation: spin 30s linear infinite;
      z-index: 0;
    }

    .gear-1 { bottom: -5rem; right: -3rem; animation-duration: 40s; }
    .gear-2 { top: -6rem; left: -4rem; font-size: 12rem; animation-direction: reverse; animation-duration: 25s; }

    @keyframes spin {
      from { transform: rotate(0deg); }
      to { transform: rotate(360deg); }
    }

    @keyframes fadeUp {
      from { opacity: 0; transform: translateY(20px); }
      to { opacity: 1; transform: translateY(0); }
    }

    @keyframes expand {
      from { opacity: 0; transform: scaleX(0); }
      to { opacity: 1; transform: scaleX(1); }
    }

    .cursor-dot {
      display: inline-block;
      width: 6px;
      height: 1rem;
      background: var(--yellow);
      margin-left: 3px;
      vertical-align: middle;
      animation: blink 1s step-end infinite;
    }

    @keyframes blink {
      0%, 100% { opacity: 1; }
      50% { opacity: 0; }
    }
  </style>