@import url('https://fonts.googleapis.com/css2?family=League+Spartan:wght@300;600;800&display=swap');

      *, *::before, *::after { box-sizing: border-box; }
      html, body { height: 100%; margin: 0; padding: 0; }

      :root {
        --bg_color: #FFFFFF;
        --primary_color: #0264D3;
        --accent_color: #eee;
        --text_color: #121212;
        --muted_color: #6b7280;
        --card_color: #ffffff;
        --success_color: #22a06b;
        --danger_color: #ff0000;
        --shadow_lg: 0 18px 40px rgba(17,24,39,0.08);
        --shadow_sm: 0 6px 16px rgba(17,24,39,0.06);

        --shadow: rgba(0,0,0,0.06);
        --logo-size: 40%;
        --app-name-size: 36px;
        --tagline-size: 14px;
      }

      body {
        background: var(--bg_color);
        font-family: 'League Spartan', sans-serif;
      }

      .wrap {
        position: fixed;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        padding: 24px;
        background: var(--bg_color);
      }

      .blob {
        position: absolute;
        border-radius: 50%;
        filter: blur(70px);
        opacity: .50;
        pointer-events: none;
        transform: translate3d(0,0,0);
        z-index: 0;
      }

      .blob.one {
        width: 220px; height: 220px;
        background: var(--primary_color);
        top: -40px; left: -40px;
      }
      .blob.two {
        width: 260px; height: 260px;
        background: var(--accent_color);
        top: 70px; right: -50px;
      }

      .blob.three {
        width: 220px; height: 220px;
        background: var(--primary_color);
        top: 600px; left: 300px;
      }
      .blob.fourth {
        width: 260px; height: 260px;
        background: var(--accent_color);
        top: 586px; right: 300px;
      }

      @keyframes floatBlob {
        0%   { transform: translateY(0); }
        50%  { transform: translateY(12px); }
        100% { transform: translateY(0); }
      }
      .blob.one { animation: floatBlob 9s ease-in-out -2s infinite; }
      .blob.two { animation: floatBlob 11s ease-in-out -4s infinite; }

      .content {
        position: relative;
        z-index: 1;
        text-align: center;
      }

      .logo {
        max-width: var(--logo-size);
        animation: logoZoom 700ms cubic-bezier(.2,.9,.3,1) both;
      }

      @keyframes logoZoom {
        0%   { transform: scale(0.85); opacity: 0; }
        60%  { transform: scale(1.06); opacity: 1; }
        100% { transform: scale(1); }
      }

      .app-name {
        margin-top: 12px;
        font-size: var(--app-name-size);
        font-weight: 800;
        background-clip: text;
        color: var(--text_color);
        text-shadow: 0 10px 18px rgba(0,0,0,0.04);
        line-height: 1.1;
        white-space: nowrap;
      }

      .tagline {
        margin-top: -2px;
        font-size: var(--tagline-size);
        color: var(--accent_color);
        font-weight: 600;
        white-space: nowrap;
      }

      /* NO CURSOR — removed caret class completely */

      .preloader-container {
        position: fixed;
        bottom: 60px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 1001;
        display: none;
      }

      .preloader {
        border: 6px solid rgba(0,0,0,0.08);
        border-top: 6px solid var(--primary_color);
        border-radius: 50%;
        width: 40px; height: 40px;
        animation: spin 1s linear infinite;
      }
      @keyframes spin { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } }

      @media (max-width: 880px) {
        :root { --logo-size: 50%; --app-name-size: 28px; }
        .blob.one { width: 180px; height: 180px; }
        .blob.two { width: 220px; height: 220px; }
      }

      @media (max-width: 480px) {
        :root { --logo-size: 80%; --app-name-size: 36px; }
        .blob.one { width: 140px; height: 140px; }
        .blob.two { width: 160px; height: 160px; }
      }