/* Loading splash (Owner idea, 13 Oct 2026 08:38): while the app is not usable yet, a small warm-gold dot waits where
   Secret will appear and slowly grows; when the app is ready it bursts (one soft bloom, rings, sparks, ~0.85 s) and
   Secret grows out of it. Driven by modules/splash.js; the markup is static in index.html so it shows from the first paint.
   Safety net without any script: the splash fades away by itself after ~12.5 s (the app is never trapped behind it). */
.splash{position:fixed;inset:0;z-index:2147483000;background:#000;overflow:hidden;
  /* where Secret's centre will be (voice Home layout); splash.js measures the real spot before the burst */
  --cx:50%;--cy:calc(env(safe-area-inset-top,0px) + 4vh + min(86vw,50vh,460px) / 2);--rs:360px;--g:1;
  -webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;
  animation:sp-giveup .5s ease 12.5s forwards}
.sp-core{position:absolute;left:var(--cx);top:var(--cy);width:0;height:0;transition:left .3s ease,top .3s ease}
.sp-grow{position:absolute;left:-14px;top:-14px;width:28px;height:28px;animation:sp-grow 5s cubic-bezier(.2,.7,.3,1) both}
.sp-halo{position:absolute;left:-46px;top:-46px;width:120px;height:120px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,199,102,.22) 0%,rgba(255,199,102,.08) 40%,rgba(255,199,102,0) 70%);animation:sp-pulse 1.8s ease-in-out infinite}
.sp-dot{position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle,#fffaf0 0%,#ffe2a6 30%,var(--gold,#ffc766) 55%,rgba(255,199,102,0) 72%);
  box-shadow:0 0 16px 4px rgba(255,199,102,.38);animation:sp-pulse 1.8s ease-in-out infinite}
.sp-note{position:absolute;left:16px;right:16px;top:calc(var(--cy) + 70px);margin:0;text-align:center;color:#8e98b4;
  font:400 .95rem/1.5 'Prompt',system-ui,-apple-system,'Segoe UI',sans-serif;opacity:0;animation:sp-fade-in .8s ease 3s forwards}
@keyframes sp-grow{from{transform:scale(.35)}to{transform:scale(1)}}
@keyframes sp-pulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.16);opacity:1}}
@keyframes sp-fade-in{to{opacity:.85}}
@keyframes sp-giveup{to{opacity:0;visibility:hidden}}

/* ---- the burst (splash.js adds .sp-burst; rings and sparks are added then) ---- */
.splash.sp-burst{pointer-events:none;animation:sp-bg-out .55s ease .25s forwards}
.sp-burst .sp-grow{animation:sp-bloom .6s cubic-bezier(.2,.8,.25,1) forwards}
.sp-burst .sp-halo,.sp-burst .sp-dot{animation:none}
.sp-burst .sp-note{animation:sp-out .2s ease forwards}
.sp-ring{position:absolute;left:calc(var(--rs) / -2);top:calc(var(--rs) / -2);width:var(--rs);height:var(--rs);border-radius:50%;
  border:2px solid var(--gold,#ffc766);box-shadow:0 0 14px rgba(255,199,102,.35),inset 0 0 14px rgba(255,199,102,.25);opacity:0;transform:scale(.04)}
.sp-ring.sp-r2{border-color:rgba(95,227,240,.85);box-shadow:0 0 14px rgba(95,227,240,.3)}
.sp-ring.sp-r3{border-color:rgba(165,105,255,.8);box-shadow:0 0 14px rgba(165,105,255,.3)}
.sp-burst .sp-ring{animation:sp-ring .8s cubic-bezier(.15,.75,.3,1) forwards}
.sp-burst .sp-ring.sp-r2{animation-delay:.07s}
.sp-burst .sp-ring.sp-r3{animation-delay:.14s}
.sp-p{position:absolute;left:calc(var(--s) / -2);top:calc(var(--s) / -2);width:var(--s);height:var(--s);border-radius:50%;
  background:var(--c);box-shadow:0 0 8px var(--c);opacity:0}
.sp-burst .sp-p{animation:sp-fly .8s cubic-bezier(.1,.7,.3,1) var(--d) forwards}
@keyframes sp-bloom{0%{transform:scale(var(--g));opacity:1;filter:brightness(1)}
  35%{transform:scale(calc(var(--g) * 2.6));opacity:1;filter:brightness(1.35)}
  100%{transform:scale(calc(var(--g) * 5));opacity:0;filter:brightness(1)}}
@keyframes sp-ring{0%{transform:scale(.04);opacity:.95}70%{opacity:.35}100%{transform:scale(1);opacity:0}}
@keyframes sp-fly{0%{transform:translate(0,0) scale(1);opacity:1}100%{transform:translate(var(--dx),var(--dy)) scale(.3);opacity:0}}
@keyframes sp-bg-out{to{background-color:rgba(0,0,0,0)}}
@keyframes sp-out{to{opacity:0}}
/* Secret grows out of the burst, in place */
body.sp-reveal #stage{animation:sp-stage-in .75s cubic-bezier(.2,.8,.25,1) .04s both}
@keyframes sp-stage-in{from{opacity:0;transform:scale(.3)}40%{opacity:1}to{opacity:1;transform:none}}

/* plain fade (hard timeout, or reduced motion) */
.splash.sp-fade{pointer-events:none;animation:sp-out .4s ease forwards}

@media (prefers-reduced-motion:reduce){
  .sp-grow,.sp-halo,.sp-dot{animation:none}
  .sp-note{animation-duration:.01s}
  .sp-burst .sp-grow{animation:none}
  .sp-ring,.sp-p{display:none}
  .splash.sp-burst{animation:sp-out .35s linear forwards}
  body.sp-reveal #stage{animation:none}
}
