/* SOFORTKEY branded processing state v5.5.6
   Central, reusable, accessible processing overlay for meaningful checks/submissions. */
:root{
  --sk-process-accent:#27c7f4;
  --sk-process-accent-2:#1d78ff;
  --sk-process-bg:rgba(4,9,15,.86);
  --sk-process-card:rgba(9,18,27,.96);
  --sk-process-line:rgba(114,202,239,.28);
  --sk-process-text:#f7fbff;
  --sk-process-muted:#aebdca;
}
.sk-process-layer{
  position:fixed;
  inset:0;
  z-index:2147483000;
  display:grid;
  place-items:center;
  padding:22px;
  background:rgba(2,6,10,.54);
  -webkit-backdrop-filter:blur(3px) saturate(112%);
  backdrop-filter:blur(3px) saturate(112%);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .16s ease,visibility .16s ease;
  overscroll-behavior:contain;
}
.sk-process-layer.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.sk-process-card{
  width:min(330px,calc(100vw - 38px));
  min-height:194px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:16px;
  padding:25px 22px 23px;
  border:1px solid var(--sk-process-line);
  border-radius:18px;
  background:
    radial-gradient(circle at 50% 10%,rgba(39,199,244,.11),transparent 52%),
    linear-gradient(180deg,rgba(11,23,34,.985),var(--sk-process-card));
  box-shadow:0 24px 70px rgba(0,0,0,.46),0 0 0 1px rgba(255,255,255,.018) inset;
  text-align:center;
  color:var(--sk-process-text);
  transform:translateY(5px) scale(.985);
  transition:transform .18s ease;
}
.sk-process-layer.is-visible .sk-process-card{transform:translateY(0) scale(1)}
.sk-process-indicator{
  position:relative;
  width:82px;
  height:82px;
  flex:0 0 82px;
  display:grid;
  place-items:center;
  isolation:isolate;
}
.sk-process-ring,.sk-process-ticks{
  position:absolute;
  inset:0;
  border-radius:50%;
  pointer-events:none;
}
.sk-process-ring{
  inset:5px;
  background:repeating-conic-gradient(
    from 0deg,
    rgba(39,199,244,.98) 0deg 16deg,
    rgba(29,120,255,.30) 16deg 25deg,
    rgba(255,255,255,.08) 25deg 35deg
  );
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));
  filter:drop-shadow(0 0 7px rgba(39,199,244,.28));
  animation:sk-process-spin 1.25s linear infinite;
}
.sk-process-ticks{
  background:repeating-conic-gradient(
    from 6deg,
    rgba(126,222,255,.0) 0deg 9deg,
    rgba(126,222,255,.38) 9deg 11deg,
    rgba(126,222,255,.0) 11deg 30deg
  );
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px));
  opacity:.68;
  animation:sk-process-spin-reverse 2.4s linear infinite;
}
.sk-process-core{
  position:relative;
  z-index:2;
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:radial-gradient(circle at 50% 38%,rgba(27,67,92,.84),rgba(4,12,20,.96) 68%);
  border:1px solid rgba(95,206,245,.22);
  box-shadow:0 0 0 5px rgba(39,199,244,.035),0 0 19px rgba(39,199,244,.16) inset;
  animation:sk-process-breathe 1.8s ease-in-out infinite;
}
.sk-process-core img{
  display:block;
  width:38px;
  height:38px;
  object-fit:contain;
  filter:drop-shadow(0 0 6px rgba(30,161,255,.26));
}
.sk-process-copy{display:grid;gap:5px;max-width:270px}
.sk-process-title{
  margin:0;
  color:var(--sk-process-text);
  font:700 15px/1.3 Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  letter-spacing:.015em;
}
.sk-process-subtitle{
  margin:0;
  min-height:18px;
  color:var(--sk-process-muted);
  font:500 12.5px/1.45 Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}
.sk-process-dots::after{
  content:"…";
  display:inline-block;
  width:1.15em;
  text-align:left;
  opacity:.45;
  animation:sk-process-dots 1.2s ease-in-out infinite;
}
html.sk-process-active,html.sk-process-active body{overscroll-behavior:none}
@keyframes sk-process-spin{to{transform:rotate(360deg)}}
@keyframes sk-process-spin-reverse{to{transform:rotate(-360deg)}}
@keyframes sk-process-breathe{0%,100%{transform:scale(.985);box-shadow:0 0 0 5px rgba(39,199,244,.035),0 0 15px rgba(39,199,244,.13) inset}50%{transform:scale(1.015);box-shadow:0 0 0 7px rgba(39,199,244,.055),0 0 23px rgba(39,199,244,.22) inset}}
@keyframes sk-process-dots{0%,100%{opacity:.35}50%{opacity:1}}
@media (max-width:560px){
  .sk-process-layer{padding:16px}
  .sk-process-card{width:min(304px,calc(100vw - 28px));min-height:178px;padding:22px 18px;border-radius:16px}
  .sk-process-indicator{width:72px;height:72px;flex-basis:72px}
  .sk-process-core{width:46px;height:46px}
  .sk-process-core img{width:34px;height:34px}
  .sk-process-title{font-size:14px}
  .sk-process-subtitle{font-size:12px}
}
@media (prefers-reduced-motion:reduce){
  .sk-process-layer,.sk-process-card{transition:none}
  .sk-process-ring,.sk-process-ticks,.sk-process-core,.sk-process-dots::after{animation:none!important}
  .sk-process-ring{transform:rotate(28deg)}
  .sk-process-ticks{opacity:.48}
}
@supports not ((-webkit-mask:radial-gradient(#000,#000)) or (mask:radial-gradient(#000,#000))){
  .sk-process-ring{background:transparent;border:3px solid rgba(39,199,244,.24);border-top-color:var(--sk-process-accent);border-right-color:var(--sk-process-accent-2)}
  .sk-process-ticks{display:none}
}