
  :root{
    /* фірмові акценти — енергійний градієнт (помаранч → мадженту → фіолет) */
    --a1:#ff6a3d; --a2:#ff2e97; --a3:#a24bff;
    --bg0:#07060e; --bg1:#0c0a1a;
    --ink:#f4f1ff; --muted:#a99fce;
  }
  *{box-sizing:border-box}
  html,body{margin:0;height:100%;background:var(--bg0);overflow:hidden;
    font-family:"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;color:var(--ink)}
  /* 3D-полотно на весь екран */
  #scene{position:fixed;inset:0;z-index:0;touch-action:none;cursor:grab}
  #scene:active{cursor:grabbing}
  /* м'яка віньєтка + фонове світіння поверх сцени, щоб текст читався */
  .veil{position:fixed;inset:0;z-index:1;pointer-events:none;
    background:
      radial-gradient(120% 90% at 50% 8%, transparent 40%, rgba(5,4,12,.55) 100%),
      radial-gradient(60% 40% at 50% 62%, rgba(12,10,26,.35), transparent 70%)}
  /* оверлей з контентом — не перехоплює drag, крім інтерактивних елементів */
  .overlay{position:fixed;inset:0;z-index:2;display:flex;flex-direction:column;
    align-items:center;justify-content:space-between;padding:clamp(20px,4vw,44px);
    pointer-events:none;text-align:center}
  .overlay .interactive{pointer-events:auto}

  .brand{font-weight:800;letter-spacing:.28em;font-size:clamp(13px,1.6vw,16px);
    background:linear-gradient(90deg,var(--a1),var(--a2),var(--a3));
    -webkit-background-clip:text;background-clip:text;color:transparent;
    text-transform:uppercase;filter:drop-shadow(0 0 18px rgba(255,46,151,.25))}

  .hero{display:flex;flex-direction:column;align-items:center;gap:clamp(14px,2vw,22px);
    max-width:820px;margin-top:auto}
  .eyebrow{font-size:clamp(11px,1.4vw,13px);letter-spacing:.34em;text-transform:uppercase;
    color:var(--muted)}
  h1{margin:0;font-size:clamp(40px,9vw,104px);line-height:.95;font-weight:900;letter-spacing:-.02em;
    background:linear-gradient(120deg,#fff 0%,var(--a1) 42%,var(--a2) 68%,var(--a3) 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
    filter:drop-shadow(0 8px 40px rgba(162,75,255,.28))}
  .sub{margin:0;color:var(--muted);font-size:clamp(15px,2.1vw,20px);max-width:560px;line-height:1.5}

  /* таймер */
  .timer{display:flex;gap:clamp(10px,2vw,20px);margin-top:6px}
  .cell{min-width:clamp(66px,13vw,104px);padding:clamp(12px,1.6vw,18px) 8px;border-radius:18px;
    background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02));
    border:1px solid rgba(255,255,255,.10);backdrop-filter:blur(10px);
    box-shadow:0 12px 40px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.08)}
  .num{font-size:clamp(28px,5.5vw,52px);font-weight:800;font-variant-numeric:tabular-nums;
    background:linear-gradient(180deg,#fff,#e7ddff);-webkit-background-clip:text;background-clip:text;color:transparent}
  .lab{margin-top:6px;font-size:clamp(9px,1.3vw,12px);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

  /* форма-заглушка */
  .signup{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:6px;width:min(460px,92vw)}
  .signup input{flex:1 1 220px;min-width:180px;padding:14px 16px;border-radius:14px;
    background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);color:var(--ink);
    font-size:15px;outline:none;transition:.2s}
  .signup input:focus{border-color:var(--a2);box-shadow:0 0 0 3px rgba(255,46,151,.18)}
  .signup input::placeholder{color:#7d75a0}
  .signup button{padding:14px 22px;border:0;border-radius:14px;cursor:pointer;font-weight:700;font-size:15px;
    color:#180a1e;background:linear-gradient(90deg,var(--a1),var(--a2),var(--a3));
    box-shadow:0 10px 30px rgba(255,46,151,.35);transition:transform .15s, box-shadow .2s;white-space:nowrap}
  .signup button:hover{transform:translateY(-2px);box-shadow:0 14px 40px rgba(255,46,151,.5)}
  .done{color:var(--ink);font-size:16px;font-weight:600;margin-top:6px}
  .done b{background:linear-gradient(90deg,var(--a1),var(--a2));-webkit-background-clip:text;background-clip:text;color:transparent}

  .foot{display:flex;flex-direction:column;gap:6px;margin-top:auto}
  .hint{font-size:12px;color:#6f6790;letter-spacing:.04em}
  .copy{font-size:11px;color:#5a5379;letter-spacing:.1em}

  @media (max-height:680px){ .signup{display:none} }
/* ── SEO-шар: доступний ботам і скрінрідерам, схований візуально ── */
.sr-only{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
