/* Welcome screen: logo que se dibuja + "AI Script Maker" con el degradado de v9.
   Se muestra solo la primera vez en cada dispositivo. Toca o presiona una tecla para saltarla. */
.ws {
  position: fixed; inset: 0; z-index: 9999;
  display: grid; place-items: center;
  padding: 24px max(24px, env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));
  background: #181818; color: #fff;
  cursor: pointer;
  transition: opacity .5s ease, visibility 0s linear .5s;
}
.ws.is-out { opacity: 0; visibility: hidden; }
.ws-inner { width: min(300px, 78vw); display: grid; justify-items: center; gap: 28px; text-align: center; }
.ws-logo { width: 100%; height: auto; display: block; overflow: visible; }

/* 1. El logo se traza forma por forma y luego se rellena (el isotipo "LS" primero) */
.ws-shape {
  stroke: #fff; stroke-width: 2.6; stroke-linejoin: round;
  stroke-dasharray: 1; stroke-dashoffset: 1;
  fill-opacity: 0;
  animation: ws-draw .9s cubic-bezier(.6,.05,.3,1) var(--d, .15s) forwards, ws-fill .45s ease calc(var(--d, .15s) + .7s) forwards;
}

/* 3. "AI Script Maker" sube con el degradado animado de v9 (.brand-animated) */
.ws-title {
  margin: 0; width: 100%; text-align: center; overflow: hidden; padding-bottom: .08em;
  font: 700 clamp(30px, 9vw, 40px)/1.14 "Wix Madefor Display", ui-sans-serif, system-ui, sans-serif;
  letter-spacing: -.035em;
}
.ws-title span {
  display: inline-block;
  background: linear-gradient(90deg, #4A9EFF 0%, #FFD84A 50%, #FF4A4A 100%);
  background-size: 200% auto;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  opacity: 0; transform: translateY(105%);
  animation: ws-rise .8s cubic-bezier(.2,.7,.2,1) 1.95s forwards, ws-pulse 6s ease-in-out 1.95s infinite alternate;
}
.ws-skip {
  position: absolute; left: 0; right: 0; bottom: calc(22px + env(safe-area-inset-bottom));
  margin: 0; text-align: center; color: rgba(255,255,255,.38); font: 500 12px/1.4 "Wix Madefor Display", ui-sans-serif, system-ui, sans-serif;
  letter-spacing: .04em; opacity: 0; animation: ws-fade .6s ease 2.8s forwards;
}

@keyframes ws-draw  { to { stroke-dashoffset: 0; } }
@keyframes ws-fill  { to { fill-opacity: 1; stroke-opacity: 0; } }
@keyframes ws-fade  { to { opacity: 1; } }
@keyframes ws-rise  { to { opacity: 1; transform: none; } }
@keyframes ws-pulse { 0% { background-position: 0% center; } 100% { background-position: 100% center; } }

@media (prefers-reduced-motion: reduce) {
  .ws-shape, .ws-title span, .ws-skip { animation: none; opacity: 1; transform: none; stroke-dashoffset: 0; fill-opacity: 1; stroke-opacity: 0; }
}