/* Loading screen of the app's connect page (owner request 2026-10-24:
   connecting the app was "not smooth"): a black page with the three plain
   rings and the PlayerTrack360 mark in their middle, an accent arc turning on
   the outer ring, the same picture as the app's own loading screen
   (drawable/loader_rings). Shown from the first frame; it gives way only to a
   question (which account) or an error. */
.app-loader{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;background:#06100c}
.app-loader[hidden]{display:none}
.app-loader-rings{position:relative;width:160px;height:160px}
.app-loader-rings span{position:absolute;border-radius:50%;border:5px solid rgb(239 252 242 / .26)}
.app-loader-rings span:nth-child(1){inset:5px}
.app-loader-rings span:nth-child(2){inset:19px;border-color:rgb(239 252 242 / .18)}
.app-loader-rings span:nth-child(3){inset:33px;border-color:rgb(239 252 242 / .12)}
.app-loader-rings .app-loader-arc{inset:5px;border-color:transparent;border-top-color:#58f496;animation:app-loader-turn 1.4s linear infinite}
.app-loader-rings i{position:absolute;left:50%;top:50%;width:64px;height:26px;transform:translate(-50%,-50%);background:#58f496;
  -webkit-mask:url(/football-tracker-icon.svg) center/contain no-repeat;mask:url(/football-tracker-icon.svg) center/contain no-repeat}
.app-loader p{margin:0;color:#acc2b4;font-size:14px;text-align:center;padding:0 24px}
@keyframes app-loader-turn{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.app-loader-rings .app-loader-arc{animation:none}}
/* Delete selected on Session Analysis (owner request 2026-10-24): the same
   rings over a dimmed page; the layer takes every tap until it is finished. */
.app-loader.delete-lock{z-index:200;background:rgb(0 0 0 / .78);touch-action:none}
.app-loader.delete-lock p{color:#effcf2;font-size:16px;font-weight:650;font-variant-numeric:tabular-nums}
/* Saving from the tracker (tracker-bluetooth-ui.mjs): the screen waits, with the progress. */
.app-loader.tracker-lock{z-index:200;gap:14px;background:rgb(0 0 0 / .78);touch-action:none}
.app-loader.tracker-lock .app-loader-rings{margin-bottom:12px}
.app-loader.tracker-lock p{margin:0;max-width:300px;padding:0 16px;color:#effcf2;font-size:16px;font-weight:650;text-align:center;font-variant-numeric:tabular-nums}
.app-loader.tracker-lock p:empty{display:none}
.app-loader.tracker-lock .tracker-lock-note{font-size:13px;font-weight:500;opacity:.8}