/**
* Loading addon
**/
:root {
    --pdapp-loader-color1: #6658dd;
    --pdapp-loader-color12: #6658dd22;
    --pdapp-loader-color2: #f1556c;
    --pdapp-loader-color3: #000000;
    --pdapp-loader-text: "Loading...";
}
#pdapp-addon-loading-page{
    display: flex;
    justify-content: center;
    align-items: center;
}
.pdapp-custom-loader{
    z-index: 99;
}
.pdapp-loader-box:hover{
    cursor: pointer;
    background: var(--pdapp-body-bg);
}
/* Classic */
.pdapp-sclassic {
    font-family: monospace;
    font-size: 30px;
    line-height: 36px;
    font-weight: bold;
}
.pdapp-sclassic-1 {
    color: var(--pdapp-loader-color1);
    animation: pdapp_sclassic_1 1s linear infinite alternate;
}
.pdapp-sclassic:before {
    content: var(--pdapp-loader-text);
}
@keyframes pdapp_sclassic_1 {to{opacity: 0}}

.pdapp-sclassic-2 {
    width: fit-content;
    padding-bottom: 8px;
    color: var(--pdapp-loader-color1);
    background: linear-gradient(var(--pdapp-loader-color1) 0 0) 0 100%/0% 3px no-repeat;
    animation: pdapp_sclassic_2 2s linear infinite;
}
@keyframes pdapp_sclassic_2 {to{background-size: 100% 3px}}

.pdapp-sclassic-3 {
    width: fit-content;
    padding: 0 5px 8px 0;
    color: var(--pdapp-loader-color1);
    background: repeating-linear-gradient(90deg,var(--pdapp-loader-color1) 0 8%, #0000 0 10%) 200% 100%/200% 3px no-repeat;
    animation: pdapp_sclassic_3 2s steps(6) infinite;
}
@keyframes pdapp_sclassic_3 {to{background-position: 80% 100%}}

.pdapp-sclassic-4 {
    width: fit-content;
    clip-path: inset(0 3ch 0 0);
    color: var(--pdapp-loader-color1);
    animation: pdapp_sclassic_4 1s steps(4) infinite;
}
@keyframes pdapp_sclassic_4 {to{clip-path: inset(0 -1ch 0 0)}}

.pdapp-sclassic-5 {
    width: fit-content;
    clip-path: inset(0 100% 0 0);
    color: var(--pdapp-loader-color1);
    animation: pdapp_sclassic_5 2s steps(11) infinite;
}
@keyframes pdapp_sclassic_5 {to{clip-path: inset(0 -1ch 0 0)}}

.pdapp-sclassic-6 {
    color: #0000;
    background: linear-gradient(90deg,var(--pdapp-loader-color1) calc(50% + 0.5ch),var(--pdapp-loader-color2) 0) right/calc(200% + 1ch) 100%;
    -webkit-background-clip: text;
    background-clip: text;
    animation: pdapp_sclassic_6 2s infinite steps(11);
}
@keyframes pdapp_sclassic_6 {to{background-position: left}}

.pdapp-sclassic-7 {
    width: fit-content;
    color:#0000;
    background:linear-gradient(90deg,var(--pdapp-loader-color1) calc(50% - 0.5ch),var(--pdapp-loader-color2) 0 calc(50% + 0.5ch),var(--pdapp-loader-color1) 0) right/calc(200% + 1ch) 100%;
    -webkit-background-clip:text;
    background-clip:text;
    animation: pdapp_sclassic_7 2s infinite steps(11);
}
@keyframes pdapp_sclassic_7 {to{background-position: left}}

.pdapp-sclassic-8{
    width: fit-content;
    color:#0000;
    background: linear-gradient(90deg,var(--pdapp-loader-color1) 25%,var(--pdapp-loader-color2) 0 50%,var(--pdapp-loader-color3) 0 75%,var(--pdapp-loader-color4) 0) 0 0/400% 100%;
    -webkit-background-clip:text;
    background-clip:text;
    animation:pdapp_sclassic_8 5s infinite cubic-bezier(0.3,1,0,1);
}
@keyframes pdapp_sclassic_8 {
    25% {background-position: calc(1*100%/3) 0}
    50% {background-position: calc(2*100%/3) 0}
    75% {background-position: calc(3*100%/3) 0}
    100%{background-position: calc(4*100%/3) 0}
}

.pdapp-sclassic-9 {
    display: inline-grid;
}
.pdapp-sclassic-9:before,
.pdapp-sclassic-9:after {
    content: var(--pdapp-loader-text);
    grid-area: 1/1;
    -webkit-mask:linear-gradient(90deg,var(--pdapp-loader-color1) 50%,#0000 0) 0 50%/2ch 100%;
    animation: pdapp_sclassic_10 1s infinite cubic-bezier(0.5,220,0.5,-220);
    color: var(--pdapp-loader-color1)
}
.pdapp-sclassic-9:after {
    -webkit-mask-position:1ch 50%;
    --s:-1;
}
@keyframes pdapp_sclassic_9 {100%{transform: translateY(calc(var(--s,1)*0.1%));}}

.pdapp-sclassic-10{
    --w:10ch;
    letter-spacing: var(--w);
    width:var(--w);
    overflow: hidden;
    white-space: nowrap;
    text-shadow:
        calc(-1*var(--w)) 0, 
        calc(-2*var(--w)) 0, 
        calc(-3*var(--w)) 0, 
        calc(-4*var(--w)) 0,
        calc(-5*var(--w)) 0, 
        calc(-6*var(--w)) 0, 
        calc(-7*var(--w)) 0, 
        calc(-8*var(--w)) 0, 
        calc(-9*var(--w)) 0;
    animation: pdapp_sclassic_10 2s infinite;
}
@keyframes pdapp_sclassic_10 {
    20% {text-shadow: 
        calc(-1*var(--w)) 0, 
        calc(-2*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-3*var(--w)) 0, 
        calc(-4*var(--w)) 0 var(--pdapp-loader-color2),
        calc(-5*var(--w)) 0 var(--pdapp-loader-color3), 
        calc(-6*var(--w)) 0, 
        calc(-7*var(--w)) 0, 
        calc(-8*var(--w)) 0 green, 
        calc(-9*var(--w)) 0;}
    40% {text-shadow: 
        calc(-1*var(--w)) 0, 
        calc(-2*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-3*var(--w)) 0 #e945e9, 
        calc(-4*var(--w)) 0,
        calc(-5*var(--w)) 0 green, 
        calc(-6*var(--w)) 0 orange, 
        calc(-7*var(--w)) 0, 
        calc(-8*var(--w)) 0 green, 
        calc(-9*var(--w)) 0;}
    60% {text-shadow: 
        calc(-1*var(--w)) 0 var(--pdapp-loader-color4), 
        calc(-2*var(--w)) 0, 
        calc(-3*var(--w)) 0 #e945e9, 
        calc(-4*var(--w)) 0,
        calc(-5*var(--w)) 0 green, 
        calc(-6*var(--w)) 0, 
        calc(-7*var(--w)) 0 yellow,
        calc(-8*var(--w)) 0 var(--pdapp-loader-color2), 
        calc(-9*var(--w)) 0 var(--pdapp-loader-color1);}
    80% {text-shadow: 
        calc(-1*var(--w)) 0 lightblue, 
        calc(-2*var(--w)) 0 yellow, 
        calc(-3*var(--w)) 0 var(--pdapp-loader-color3), 
        calc(-4*var(--w)) 0 var(--pdapp-loader-color2),
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-6*var(--w)) 0, 
        calc(-7*var(--w)) 0 grey, 
        calc(-8*var(--w)) 0 var(--pdapp-loader-color3), 
        calc(-9*var(--w)) 0 ;}
}

.pdapp-sclassic-11{
  --w:10ch;
  line-height: 1.2em;
  letter-spacing: var(--w);
  width: var(--w);
  overflow: hidden;
  white-space: nowrap;
  color: #0000;
  animation: pdapp_sclassic_13 2s infinite;
}
@keyframes pdapp_sclassic_11{
   0% {text-shadow: 
        calc( 0*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-1*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-2*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-3*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-4*var(--w)) -1.2em var(--pdapp-loader-color1), 
        calc(-5*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-6*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-7*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-8*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-9*var(--w)) -1.2em var(--pdapp-loader-color1)}
   4% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-2*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-3*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-4*var(--w)) -1.2em var(--pdapp-loader-color1), 
        calc(-5*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-6*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-7*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-8*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-9*var(--w)) -1.2em var(--pdapp-loader-color1)}
   8% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-3*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-4*var(--w)) -1.2em var(--pdapp-loader-color1), 
        calc(-5*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-6*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-7*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-8*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-9*var(--w)) -1.2em var(--pdapp-loader-color1)}
  12% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-4*var(--w)) -1.2em var(--pdapp-loader-color1), 
        calc(-5*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-6*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-7*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-8*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-9*var(--w)) -1.2em var(--pdapp-loader-color1)}
  16% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) -1.2em var(--pdapp-loader-color1), 
        calc(-5*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-6*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-7*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-8*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-9*var(--w)) -1.2em var(--pdapp-loader-color1)}
  20% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) 0      var(--pdapp-loader-color1), 
        calc(-5*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-6*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-7*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-8*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-9*var(--w)) -1.2em var(--pdapp-loader-color1)}
  24% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) 0      var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0      var(--pdapp-loader-color1),calc(-6*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-7*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-8*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-9*var(--w)) -1.2em var(--pdapp-loader-color1)}
  28% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) 0      var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0      var(--pdapp-loader-color1),calc(-6*var(--w)) 0      var(--pdapp-loader-color1),calc(-7*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-8*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-9*var(--w)) -1.2em var(--pdapp-loader-color1)}
  32% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) 0      var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0      var(--pdapp-loader-color1),calc(-6*var(--w)) 0      var(--pdapp-loader-color1),calc(-7*var(--w)) 0      var(--pdapp-loader-color1),calc(-8*var(--w)) -1.2em var(--pdapp-loader-color1),calc(-9*var(--w)) -1.2em var(--pdapp-loader-color1)}
  36% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) 0      var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0      var(--pdapp-loader-color1),calc(-6*var(--w)) 0      var(--pdapp-loader-color1),calc(-7*var(--w)) 0      var(--pdapp-loader-color1),calc(-8*var(--w)) 0      var(--pdapp-loader-color1),calc(-9*var(--w)) -1.2em var(--pdapp-loader-color1)}
  40%,
  60% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) 0      var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0      var(--pdapp-loader-color1),calc(-6*var(--w)) 0      var(--pdapp-loader-color1),calc(-7*var(--w)) 0      var(--pdapp-loader-color1),calc(-8*var(--w)) 0      var(--pdapp-loader-color1),calc(-9*var(--w)) 0      var(--pdapp-loader-color1)}
  64% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) 0      var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0      var(--pdapp-loader-color1),calc(-6*var(--w)) 0      var(--pdapp-loader-color1),calc(-7*var(--w)) 0      var(--pdapp-loader-color1),calc(-8*var(--w)) 0      var(--pdapp-loader-color1),calc(-9*var(--w)) 1.2em  var(--pdapp-loader-color1)}
  68% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) 0      var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0      var(--pdapp-loader-color1),calc(-6*var(--w)) 0      var(--pdapp-loader-color1),calc(-7*var(--w)) 0      var(--pdapp-loader-color1),calc(-8*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-9*var(--w)) 1.2em  var(--pdapp-loader-color1)}
  72% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) 0      var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0      var(--pdapp-loader-color1),calc(-6*var(--w)) 0      var(--pdapp-loader-color1),calc(-7*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-8*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-9*var(--w)) 1.2em  var(--pdapp-loader-color1)}
  76% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) 0      var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0      var(--pdapp-loader-color1),calc(-6*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-7*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-8*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-9*var(--w)) 1.2em  var(--pdapp-loader-color1)}
  80% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) 0      var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-6*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-7*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-8*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-9*var(--w)) 1.2em  var(--pdapp-loader-color1)}
  84% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 0      var(--pdapp-loader-color1),calc(-4*var(--w)) 1.2em  var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-6*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-7*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-8*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-9*var(--w)) 1.2em  var(--pdapp-loader-color1)}
  88% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 0      var(--pdapp-loader-color1),calc(-3*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-4*var(--w)) 1.2em  var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-6*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-7*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-8*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-9*var(--w)) 1.2em  var(--pdapp-loader-color1)}
  92% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 0      var(--pdapp-loader-color1),calc(-2*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-3*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-4*var(--w)) 1.2em  var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-6*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-7*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-8*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-9*var(--w)) 1.2em  var(--pdapp-loader-color1)}
  96% {text-shadow: 
        calc( 0*var(--w)) 0      var(--pdapp-loader-color1),calc(-1*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-2*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-3*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-4*var(--w)) 1.2em  var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-6*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-7*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-8*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-9*var(--w)) 1.2em  var(--pdapp-loader-color1)}
  100% {text-shadow: 
        calc( 0*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-1*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-2*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-3*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-4*var(--w)) 1.2em  var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-6*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-7*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-8*var(--w)) 1.2em  var(--pdapp-loader-color1),calc(-9*var(--w)) 1.2em  var(--pdapp-loader-color1)}
}

.pdapp-sclassic-12{
  --w:10ch;
  line-height: 1.2em;
  letter-spacing: var(--w);
  width: var(--w);
  overflow: hidden;
  white-space: nowrap;
  color: #0000;
  animation: pdapp_sclassic_12 2s infinite linear;
}
@keyframes pdapp_sclassic_12{
   0% {text-shadow: 
        calc( 0*var(--w)) 0,calc(-1*var(--w)) 0,calc(-2*var(--w)) 0,calc(-3*var(--w)) 0,calc(-4*var(--w)) 0, 
        calc(-5*var(--w)) 0,calc(-6*var(--w)) 0,calc(-7*var(--w)) 0,calc(-8*var(--w)) 0,calc(-9*var(--w)) 0}
   4% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0,calc(-2*var(--w)) 0,calc(-3*var(--w)) 0,calc(-4*var(--w)) 0, 
        calc(-5*var(--w)) 0,calc(-6*var(--w)) 0,calc(-7*var(--w)) 0,calc(-8*var(--w)) 0,calc(-9*var(--w)) 0}
   8% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0,calc(-3*var(--w)) 0,calc(-4*var(--w)) 0, 
        calc(-5*var(--w)) 0,calc(-6*var(--w)) 0,calc(-7*var(--w)) 0,calc(-8*var(--w)) 0,calc(-9*var(--w)) 0}
  12% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0,calc(-4*var(--w)) 0, 
        calc(-5*var(--w)) 0,calc(-6*var(--w)) 0,calc(-7*var(--w)) 0,calc(-8*var(--w)) 0,calc(-9*var(--w)) 0}
  16% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0, 
        calc(-5*var(--w)) 0,calc(-6*var(--w)) 0,calc(-7*var(--w)) 0,calc(-8*var(--w)) 0,calc(-9*var(--w)) 0}
  20% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0,calc(-6*var(--w)) 0,calc(-7*var(--w)) 0,calc(-8*var(--w)) 0,calc(-9*var(--w)) 0}
  24% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0,calc(-7*var(--w)) 0,calc(-8*var(--w)) 0,calc(-9*var(--w)) 0}
  28% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0,calc(-8*var(--w)) 0,calc(-9*var(--w)) 0}
  32% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0,calc(-9*var(--w)) 0}
  36% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0}
  40%,
  60% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  64% {text-shadow: 
        calc( 0*var(--w)) 0,calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  68% {text-shadow: 
        calc( 0*var(--w)) 0,calc(-1*var(--w)) 0,calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  72% {text-shadow: 
        calc( 0*var(--w)) 0,calc(-1*var(--w)) 0,calc(-2*var(--w)) 0,calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  76% {text-shadow: 
        calc( 0*var(--w)) 0,calc(-1*var(--w)) 0,calc(-2*var(--w)) 0,calc(-3*var(--w)) 0,calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  80% {text-shadow: 
        calc( 0*var(--w)) 0,calc(-1*var(--w)) 0,calc(-2*var(--w)) 0,calc(-3*var(--w)) 0,calc(-4*var(--w)) 0, 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  84% {text-shadow: 
        calc( 0*var(--w)) 0,calc(-1*var(--w)) 0,calc(-2*var(--w)) 0,calc(-3*var(--w)) 0,calc(-4*var(--w)) 0, 
        calc(-5*var(--w)) 0,calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  88% {text-shadow: 
        calc( 0*var(--w)) 0,calc(-1*var(--w)) 0,calc(-2*var(--w)) 0,calc(-3*var(--w)) 0,calc(-4*var(--w)) 0, 
        calc(-5*var(--w)) 0,calc(-6*var(--w)) 0,calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  92% {text-shadow: 
        calc( 0*var(--w)) 0,calc(-1*var(--w)) 0,calc(-2*var(--w)) 0,calc(-3*var(--w)) 0,calc(-4*var(--w)) 0, 
        calc(-5*var(--w)) 0,calc(-6*var(--w)) 0,calc(-7*var(--w)) 0,calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  96% {text-shadow: 
        calc( 0*var(--w)) 0,calc(-1*var(--w)) 0,calc(-2*var(--w)) 0,calc(-3*var(--w)) 0,calc(-4*var(--w)) 0, 
        calc(-5*var(--w)) 0,calc(-6*var(--w)) 0,calc(-7*var(--w)) 0,calc(-8*var(--w)) 0,calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  100% {text-shadow: 
        calc( 0*var(--w)) 0,calc(-1*var(--w)) 0,calc(-2*var(--w)) 0,calc(-3*var(--w)) 0,calc(-4*var(--w)) 0, 
        calc(-5*var(--w)) 0,calc(-6*var(--w)) 0,calc(-7*var(--w)) 0,calc(-8*var(--w)) 0,calc(-9*var(--w)) 0}
}

.pdapp-sclassic-13{
  --w:10ch;
  line-height: 1.4em;
  letter-spacing: var(--w);
  width: var(--w);
  overflow: hidden;
  white-space: nowrap;
  color: #0000;
  text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1);
  animation: pdapp_sclassic_13 2s infinite linear;
}
@keyframes pdapp_sclassic_13{
  9.09% {text-shadow: 
        calc( 0*var(--w)) -10px var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  18.18% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) -10px var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  27.27% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) -10px var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  36.36% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) -10px var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  45.45% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) -10px var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  54.54% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) -10px var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  63.63% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) -10px var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  72.72% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) -10px var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  81.81% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) -10px var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1)}
  90.90% {text-shadow: 
        calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
        calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) -10px var(--pdapp-loader-color1)}
}

.pdapp-sclassic-14{
    width: fit-content;
    font-weight: bold;
    font-family: monospace;
    font-size: 30px;
    background:linear-gradient(90deg,var(--pdapp-loader-color1) 50%,#0000 0) right/200% 100%;
    animation: pdapp_sclassic_14 2s infinite linear;
}
.pdapp-sclassic-14::before {
    content: var(--pdapp-loader-text);
    color: #0000;
    padding: 0 5px;
    background: inherit;
    background-image: linear-gradient(90deg,var(--pdapp-loader-color2) 50%,var(--pdapp-loader-color1) 0);
    -webkit-background-clip:text;
    background-clip:text;
}
@keyframes pdapp_sclassic_14{
    100%{background-position: left}
}

.pdapp-sclassic-15 {
    width: fit-content;
    font-weight: bold;
    font-family: monospace;
    font-size: 30px;
    background: radial-gradient(circle closest-side,var(--pdapp-loader-color1) 94%,#0000) right/calc(200% - 1em) 100%;
    animation: pdapp_sclassic_15 1s infinite alternate linear;
}
.pdapp-sclassic-15::before {
    content: var(--pdapp-loader-text);
    line-height: 1em;
    color: #0000;
    background: inherit;
    background-image: radial-gradient(circle closest-side,var(--pdapp-loader-color2) 94%,var(--pdapp-loader-color1));
    -webkit-background-clip:text;
    background-clip:text;
}
@keyframes pdapp_sclassic_15{
    100%{background-position: left}
}

.pdapp-sclassic-16{
    --w:10ch;
    letter-spacing: var(--w);
    width: var(--w);
    overflow: hidden;
    white-space: nowrap;
    color: #0000;
    animation: pdapp_sclassic_16 1s infinite alternate;
}
@keyframes pdapp_sclassic_16{
    0%,15%,75%,100% {
    text-shadow: 
            calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
            calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1);
    }
    20% {
    text-shadow: 
            calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 9px var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
            calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1);
    }
    25% {
    text-shadow: 
            calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
            calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 7px var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1);
    }
    30% {
    text-shadow: 
            calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
            calc(-5*var(--w)) 0 9px var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1);
    }
    35% {
    text-shadow: 
            calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
            calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 7px var(--pdapp-loader-color1);
    }
    40% {
    text-shadow: 
            calc( 0*var(--w)) 0 5px var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
            calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1);
    }
    45% {
    text-shadow: 
            calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
            calc(-5*var(--w)) 0 7px var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1);
    }
    50% {
    text-shadow: 
            calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 5px var(--pdapp-loader-color1), 
            calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1);
    }
    55% {
    text-shadow: 
            calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
            calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 8px var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1);
    }
    60% {
    text-shadow: 
            calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
            calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 5px var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1);
    }
    65% {
    text-shadow: 
            calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 7px var(--pdapp-loader-color1),calc(-2*var(--w)) 0 var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
            calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1);
    }
    70% {
    text-shadow: 
            calc( 0*var(--w)) 0 var(--pdapp-loader-color1),calc(-1*var(--w)) 0 var(--pdapp-loader-color1),calc(-2*var(--w)) 0 9px var(--pdapp-loader-color1),calc(-3*var(--w)) 0 var(--pdapp-loader-color1),calc(-4*var(--w)) 0 var(--pdapp-loader-color1), 
            calc(-5*var(--w)) 0 var(--pdapp-loader-color1),calc(-6*var(--w)) 0 var(--pdapp-loader-color1),calc(-7*var(--w)) 0 var(--pdapp-loader-color1),calc(-8*var(--w)) 0 var(--pdapp-loader-color1),calc(-9*var(--w)) 0 var(--pdapp-loader-color1);
    }
}

/* Dots */
.pdapp-sdot-1 {
    width: 60px;
    aspect-ratio: 4;
    background: radial-gradient(circle closest-side,var(--pdapp-loader-color1) 90%,#0000) 0/calc(100%/3) 100% space;
    clip-path: inset(0 100% 0 0);
    animation: pdapp_sdot_1 1s steps(4) infinite;
}
@keyframes pdapp_sdot_1 {to{clip-path: inset(0 -34% 0 0)}}

.pdapp-sdot-2 {
    width: 60px;
    aspect-ratio: 4;
    background: radial-gradient(circle closest-side,var(--pdapp-loader-color1) 90%,#0000) 0/calc(100%/3) 100% no-repeat;
    animation: pdapp_sdot_2 1s steps(3) infinite;
}
@keyframes pdapp_sdot_2 {to{background-position: 150%}}

.pdapp-sdot-3 {
    width: 60px;
    aspect-ratio: 2;
    --_g: no-repeat radial-gradient(circle closest-side,var(--pdapp-loader-color1) 90%,#0000);
    background: 
        var(--_g) 0%   50%,
        var(--_g) 50%  50%,
        var(--_g) 100% 50%;
    background-size: calc(100%/3) 50%;
    animation: pdapp_sdot_3 1s infinite linear;
}
@keyframes pdapp_sdot_3 {
    20%{background-position:0%   0%, 50%  50%,100%  50%}
    40%{background-position:0% 100%, 50%   0%,100%  50%}
    60%{background-position:0%  50%, 50% 100%,100%   0%}
    80%{background-position:0%  50%, 50%  50%,100% 100%}
}

.pdapp-sdot-4 {
    width: 60px;
    aspect-ratio: 4;
    --c:var(--pdapp-loader-color1) 90%,#0000;
    background: 
        radial-gradient(circle closest-side at left  6px top 50%,var(--c)),
        radial-gradient(circle closest-side                     ,var(--c)),
        radial-gradient(circle closest-side at right 6px top 50%,var(--c));
    background-size: 100% 100%;
    background-repeat: no-repeat;
    animation: pdapp_sdot_4 1s infinite alternate;
}
@keyframes pdapp_sdot_4 {
    to{width:25px;aspect-ratio: 1}
}

.pdapp-sdot-5 {
    width: 15px;
    aspect-ratio: 1;
    border-radius: 50%;
    animation: pdapp_sdot_5 1s infinite linear alternate;
}
@keyframes pdapp_sdot_5 {
    0%  {box-shadow: 20px 0 var(--pdapp-loader-color1), -20px 0 var(--pdapp-loader-color12);background: var(--pdapp-loader-color1) }
    33% {box-shadow: 20px 0 var(--pdapp-loader-color1), -20px 0 var(--pdapp-loader-color12);background: var(--pdapp-loader-color12)}
    66% {box-shadow: 20px 0 var(--pdapp-loader-color12),-20px 0 var(--pdapp-loader-color1); background: var(--pdapp-loader-color12)}
    100%{box-shadow: 20px 0 var(--pdapp-loader-color12),-20px 0 var(--pdapp-loader-color1); background: var(--pdapp-loader-color1) }
}

.pdapp-sdot-6 {
    width: 15px;
    aspect-ratio: 1;
    color: var(--pdapp-loader-color1);
    background: var(--pdapp-loader-color1);
    border-radius: 50%;
    animation: pdapp_sdot_6 1s infinite linear alternate;
}
@keyframes pdapp_sdot_6 {
    0%  {box-shadow: 15px 0,-25px 0}
    50% {box-shadow: 15px 0,-15px 0}
    100%{box-shadow: 25px 0,-15px 0}
}

.pdapp-sdot-7 {
    width: 60px;
    aspect-ratio: 4;
    --_g: no-repeat radial-gradient(circle closest-side,var(--pdapp-loader-color1) 90%,#0000);
    background: 
        var(--_g) 0%   50%,
        var(--_g) 50%  50%,
        var(--_g) 100% 50%;
    background-size: calc(100%/3) 100%;
    animation: pdapp_sdot_7 1s infinite linear;
}
@keyframes pdapp_sdot_7 {
    33%{background-size:calc(100%/3) 0%  ,calc(100%/3) 100%,calc(100%/3) 100%}
    50%{background-size:calc(100%/3) 100%,calc(100%/3) 0%  ,calc(100%/3) 100%}
    66%{background-size:calc(100%/3) 100%,calc(100%/3) 100%,calc(100%/3) 0%  }
}

.pdapp-sdot-8 {
    width: 50px;
    height: 28px;
    --_g: no-repeat radial-gradient(farthest-side,var(--pdapp-loader-color1) 94%,#0000);
    background:
        var(--_g) 50%  0,
        var(--_g) 100% 0;
    background-size: 12px 12px;
    position: relative;
    animation: pdapp_sdot_8-0 1.5s linear infinite;
}
.pdapp-sdot-8:before {
    content: "";
    position: absolute;
    height: 12px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--pdapp-loader-color1);
    left:0;
    top:0;
    animation: 
        pdapp_sdot_8-1 1.5s linear infinite,
        pdapp_sdot_8-2 0.5s cubic-bezier(0,200,.8,200) infinite;
}
@keyframes pdapp_sdot_8-0 {
    0%,31%  {background-position: 50% 0   ,100% 0}
    33%     {background-position: 50% 100%,100% 0}
    43%,64% {background-position: 50% 0   ,100% 0}
    66%     {background-position: 50% 0   ,100% 100%}
    79%     {background-position: 50% 0   ,100% 0}
    100%    {transform:translateX(calc(-100%/3))}
}
@keyframes pdapp_sdot_8-1 {
    100% {left:calc(100% + 7px)}
}
@keyframes pdapp_sdot_8-2 {
    100% {top:-0.1px}
}

/* Spinner */
.pdapp-sspinner-1 {
    width: 50px;
    aspect-ratio: 1;
    border-radius: 50%;
    border: 8px solid;
    border-color: var(--pdapp-loader-color1) #0000;
    animation: pdapp_sspinner_1 1s infinite;
}
@keyframes pdapp_sspinner_1 {to{transform: rotate(.5turn)}}

.pdapp-sspinner-2 {
    width: 50px;
    aspect-ratio: 1;
    border-radius: 50%;
    border: 8px solid var(--pdapp-loader-color1);
    border-right-color: var(--pdapp-loader-color2);
    animation: pdapp_sspinner_2 1s infinite linear;
}
@keyframes pdapp_sspinner_2 {to{transform: rotate(1turn)}}

.pdapp-sspinner-3 {
    width: 50px;
    padding: 8px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--pdapp-loader-color1);
    --_m: 
        conic-gradient(#0000 10%,var(--pdapp-loader-color1)),
        linear-gradient(var(--pdapp-loader-color1) 0 0) content-box;
    -webkit-mask: var(--_m);
            mask: var(--_m);
    -webkit-mask-composite: source-out;
            mask-composite: subtract;
    animation: pdapp_sspinner_3 1s infinite linear;
}
@keyframes pdapp_sspinner_3 {to{transform: rotate(1turn)}}

.pdapp-sspinner-4 {
    width: 50px;
    --b: 8px; 
    aspect-ratio: 1;
    border-radius: 50%;
    padding: 1px;
    background: conic-gradient(#0000 10%,var(--pdapp-loader-color1)) content-box;
    -webkit-mask:
        repeating-conic-gradient(#0000 0deg,var(--pdapp-loader-color1) 1deg 20deg,#0000 21deg 36deg),
        radial-gradient(farthest-side,#0000 calc(100% - var(--b) - 1px),var(--pdapp-loader-color1) calc(100% - var(--b)));
    -webkit-mask-composite: destination-in;
            mask-composite: intersect;
    animation:pdapp_sspinner_4 1s infinite steps(10);
}
@keyframes pdapp_sspinner_4 {to{transform: rotate(1turn)}}

.pdapp-sspinner-5 {
    width: 50px;
    --b: 8px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--pdapp-loader-color1);
    -webkit-mask:
        repeating-conic-gradient(#0000 0deg,var(--pdapp-loader-color1) 1deg 70deg,#0000 71deg 90deg),
        radial-gradient(farthest-side,#0000 calc(100% - var(--b) - 1px),var(--pdapp-loader-color1) calc(100% - var(--b)));
    -webkit-mask-composite: destination-in;
            mask-composite: intersect;
    animation: pdapp_sspinner_5 1s infinite;
}
@keyframes pdapp_sspinner_5 {to{transform: rotate(.5turn)}}

.pdapp-sspinner-6 {
    width: 50px;
    aspect-ratio: 1;
    border-radius: 50%;
    padding: 3px;
    background: 
        radial-gradient(farthest-side,var(--pdapp-loader-color1) 95%,#0000) 50% 0/12px 12px no-repeat,
        radial-gradient(farthest-side,#0000 calc(100% - 5px),var(--pdapp-loader-color1) calc(100% - 4px)) content-box;
    animation: pdapp_sspinner_6 2s infinite ;
}
@keyframes pdapp_sspinner_6 {to{transform: rotate(1turn)}}

.pdapp-sspinner-7 {
    width: 50px;
    aspect-ratio: 1;
    --_c:no-repeat radial-gradient(farthest-side,var(--pdapp-loader-color1) 92%,#0000);
    background: 
        var(--_c) top,
        var(--_c) left,
        var(--_c) right,
        var(--_c) bottom;
    background-size: 12px 12px;
    animation: pdapp_sspinner_7 1s infinite;
}
@keyframes pdapp_sspinner_7 {to{transform: rotate(.5turn)}}

.pdapp-sspinner-8 {
  width: 50px;
  aspect-ratio: 1;
  display: grid;
}
.pdapp-sspinner-8::before,
.pdapp-sspinner-8::after {    
    content:"";
    grid-area: 1/1;
    --c:no-repeat radial-gradient(farthest-side,var(--pdapp-loader-color1) 92%,#0000);
    background: 
        var(--c) 50%  0, 
        var(--c) 50%  100%, 
        var(--c) 100% 50%, 
        var(--c) 0    50%;
    background-size: 12px 12px;
    animation: pdapp_sspinner_8 1s infinite;
}
.pdapp-sspinner-8::before {
    margin: 4px;
    filter: hue-rotate(45deg);
    background-size: 8px 8px;
    animation-timing-function: linear
}
@keyframes pdapp_sspinner_8 { 
    100%{transform: rotate(.5turn)}
}

.pdapp-sspinner-9 {
    width: 50px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: 
        radial-gradient(farthest-side,var(--pdapp-loader-color1) 94%,#0000) top/8px 8px no-repeat,
        conic-gradient(#0000 30%,var(--pdapp-loader-color1));
    -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 8px),var(--pdapp-loader-color1) 0);
    animation: pdapp_sspinner_9 1s infinite linear;
}
@keyframes pdapp_sspinner_9{ 
    100%{transform: rotate(1turn)}
}

.pdapp-sspinner-10 {
    width: 50px;
    aspect-ratio: 1;
    display: grid;
    animation: pdapp_sspinner_10 4s infinite;
}
.pdapp-sspinner-10::before,
.pdapp-sspinner-10::after {    
    content: "";
    grid-area: 1/1;
    border: 8px solid;
    border-radius: 50%;
    border-color: var(--pdapp-loader-color1) var(--pdapp-loader-color1) #0000 #0000;
    mix-blend-mode: darken;
    animation: pdapp_sspinner_10 1s infinite linear;
}
.pdapp-sspinner-10::after {
    border-color: #0000 #0000 var(--pdapp-loader-color2) var(--pdapp-loader-color2);
    animation-direction: reverse;
}
@keyframes pdapp_sspinner_10{ 
    100%{transform: rotate(1turn)}
}

.pdapp-sspinner-11 {
    width: 50px;
    aspect-ratio: 1;
    display: grid;
    border: 4px solid #0000;
    border-radius: 50%;
    border-right-color: var(--pdapp-loader-color1);
    animation: pdapp_sspinner_11 1s infinite linear;
}
.pdapp-sspinner-11::before,
.pdapp-sspinner-11::after {    
    content: "";
    grid-area: 1/1;
    margin: 2px;
    border: inherit;
    border-radius: 50%;
    animation: pdapp_sspinner_11 2s infinite;
}
.pdapp-sspinner-11::after {
    margin: 8px;
    animation-duration: 3s;
}
@keyframes pdapp_sspinner_11{ 
    100%{transform: rotate(1turn)}
}

.pdapp-sspinner-12 {
  width: 50px;
  aspect-ratio: 1;
  display: grid;
  border: 4px solid #0000;
  border-radius: 50%;
  border-color: var(--pdapp-loader-color1) #0000;
  animation: pdapp_sspinner_12 1s infinite linear;
}
.pdapp-sspinner-12::before,
.pdapp-sspinner-12::after {
    content: "";
    grid-area: 1/1;
    margin: 2px;
    border: inherit;
    border-radius: 50%;
}
.pdapp-sspinner-12::before {
    border-color: var(--pdapp-loader-color1) #0000;
    animation: inherit; 
    animation-duration: .5s;
    animation-direction: reverse;
}
.pdapp-sspinner-12::after {
  margin: 8px;
}
@keyframes pdapp_sspinner_12 { 
    100%{transform: rotate(1turn)}
}

.pdapp-sspinner-13 {
    width: 70px;
    aspect-ratio: 1;
    background:
        radial-gradient(farthest-side,var(--pdapp-loader-color1) 90%,#0000) center/16px 16px,
        radial-gradient(farthest-side,var(--pdapp-loader-color2)   90%,#0000) bottom/12px 12px;
    background-repeat: no-repeat;
    animation: pdapp_sspinner_13 1s infinite linear;
    position: relative;
}
.pdapp-sspinner-13::before {    
    content:"";
    position: absolute;
    width: 8px;
    aspect-ratio: 1;
    inset: auto 0 16px;
    margin: auto;
    background: var(--pdapp-loader-color3);
    border-radius: 50%;
    transform-origin: 50% calc(100% + 10px);
    animation: inherit;
    animation-duration: 0.5s;
}
@keyframes pdapp_sspinner_13 { 
  100%{transform: rotate(1turn)}
}

.pdapp-sspinner-14 {
    width: 50px;
    aspect-ratio: 1;
    --c:no-repeat radial-gradient(farthest-side,var(--pdapp-loader-color1) 92%,#0000);
    background: 
        var(--c) 50%  0, 
        var(--c) 50%  100%, 
        var(--c) 100% 50%, 
        var(--c) 0    50%;
    background-size: 10px 10px;
    animation: pdapp_sspinner_14 1s infinite;
    position: relative;
}
.pdapp-sspinner-14::before {    
    content:"";
    position: absolute;
    inset:0;
    margin: 3px;
    background: repeating-conic-gradient(#0000 0 35deg,var(--pdapp-loader-color1) 0 90deg);
    -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 3px),var(--pdapp-loader-color1) 0);
    border-radius: 50%;
}
@keyframes pdapp_sspinner_14 { 
    100%{transform: rotate(.5turn)}
}

.pdapp-sspinner-15 {
    width: 50px;
    aspect-ratio: 1;
    display: grid;
    color: var(--pdapp-loader-color1);
    background: radial-gradient(farthest-side, var(--pdapp-loader-color1) calc(100% - 6px),#0000 calc(100% - 5px) 0);
    -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 13px),var(--pdapp-loader-color1) calc(100% - 12px));
    border-radius: 50%;
    animation: pdapp_sspinner_15 2s infinite linear;
}
.pdapp-sspinner-15::before,
.pdapp-sspinner-15::after {    
    content: "";
    grid-area: 1/1;
    background:
        linear-gradient(var(--pdapp-loader-color1) 0 0) center,
        linear-gradient(var(--pdapp-loader-color1) 0 0) center;
    background-size: 100% 10px,10px 100%;
    background-repeat: no-repeat;
}
.pdapp-sspinner-15::after {
    transform: rotate(45deg);
}
@keyframes pdapp_sspinner_15 { 
    100%{transform: rotate(1turn)}
}

.pdapp-sspinner-16 {
    width: 50px;
    aspect-ratio: 1;
    border-radius: 50%;
    border: 8px solid var(--pdapp-loader-color1);
    animation:
        pdapp_sspinner_16-1 0.8s infinite linear alternate,
        pdapp_sspinner_16-2 1.6s infinite linear;
}
@keyframes pdapp_sspinner_16-1{
    0%    {clip-path: polygon(50% 50%,0       0,  50%   0%,  50%    0%, 50%    0%, 50%    0%, 50%    0% )}
    12.5% {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100%   0%, 100%   0%, 100%   0% )}
    25%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 100% 100%, 100% 100% )}
    50%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
    62.5% {clip-path: polygon(50% 50%,100%    0, 100%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
    75%   {clip-path: polygon(50% 50%,100% 100%, 100% 100%,  100% 100%, 100% 100%, 50%  100%, 0%   100% )}
    100%  {clip-path: polygon(50% 50%,50%  100%,  50% 100%,   50% 100%,  50% 100%, 50%  100%, 0%   100% )}
}
@keyframes pdapp_sspinner_16-2{ 
    0%    {transform:scaleY(1)  rotate(0deg)}
    49.99%{transform:scaleY(1)  rotate(135deg)}
    50%   {transform:scaleY(-1) rotate(0deg)}
    100%  {transform:scaleY(-1) rotate(-135deg)}
}

.pdapp-sspinner-17 {
    width: 50px;
    aspect-ratio: 1;
    display: grid;
    border-radius: 50%;
    background:
        linear-gradient(0deg ,var(--pdapp-loader-color150) 30%,#0000 0 70%,var(--pdapp-loader-color100) 0) 50%/8% 100%,
        linear-gradient(90deg,var(--pdapp-loader-color125) 30%,#0000 0 70%,var(--pdapp-loader-color175) 0) 50%/100% 8%;
    background-repeat: no-repeat;
    animation: pdapp_sspinner_17 1s infinite steps(12);
}
.pdapp-sspinner-17::before,
.pdapp-sspinner-17::after {
    content: "";
    grid-area: 1/1;
    border-radius: 50%;
    background: inherit;
    opacity: 0.915;
    transform: rotate(30deg);
}
.pdapp-sspinner-17::after {
    opacity: 0.83;
    transform: rotate(60deg);
}
@keyframes pdapp_sspinner_17 {
    100% {transform: rotate(1turn)}
}

.pdapp-sspinner-18 {
    width: 50px;
    aspect-ratio: 1;
    border-radius: 50%;
    border: 8px solid #0000;
    border-right-color: var(--pdapp-loader-color197);
    position: relative;
    animation: pdapp_sspinner_18 1s infinite linear;
}
.pdapp-sspinner-18:before,
.pdapp-sspinner-18:after {
    content: "";
    position: absolute;
    inset: -8px;
    border-radius: 50%;
    border: inherit;
    animation: inherit;
    animation-duration: 2s;
}
.pdapp-sspinner-18:after {
    animation-duration: 4s;
}
@keyframes pdapp_sspinner_18 {
    100% {transform: rotate(1turn)}
}

.pdapp-sspinner-19 {
    width: 50px;
    aspect-ratio: 1;
    display:grid;
    -webkit-mask: conic-gradient(from 15deg,#0000,var(--pdapp-loader-color2));
    animation: pdapp_sspinner_19 1s infinite steps(12);
}
.pdapp-sspinner-19,
.pdapp-sspinner-19:before,
.pdapp-sspinner-19:after{
    background:
    radial-gradient(closest-side at 50% 12.5%,
     var(--pdapp-loader-color1) 96%,#0000) 50% 0/20% 80% repeat-y,
    radial-gradient(closest-side at 12.5% 50%,
     var(--pdapp-loader-color1) 96%,#0000) 0 50%/80% 20% repeat-x;
}
.pdapp-sspinner-19:before,
.pdapp-sspinner-19:after {
    content: "";
    grid-area: 1/1;
    transform: rotate(30deg);
}
.pdapp-sspinner-19:after {
    transform: rotate(60deg);
}
@keyframes pdapp_sspinner_19 {
    100% {transform:rotate(1turn)}
}

.pdapp-sspinner-20 {
    --d:22px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    color: var(--pdapp-loader-color1);
    box-shadow: 
        calc(1*var(--d))      calc(0*var(--d))     0 0,
        calc(0.707*var(--d))  calc(0.707*var(--d)) 0 1px,
        calc(0*var(--d))      calc(1*var(--d))     0 2px,
        calc(-0.707*var(--d)) calc(0.707*var(--d)) 0 3px,
        calc(-1*var(--d))     calc(0*var(--d))     0 4px,
        calc(-0.707*var(--d)) calc(-0.707*var(--d))0 5px,
        calc(0*var(--d))      calc(-1*var(--d))    0 6px;
    animation: pdapp_sspinner_20 1s infinite steps(8);
}
@keyframes pdapp_sspinner_20 {
    100% {transform: rotate(1turn)}
}

/* Shape */
.pdapp-sshape-1 {
    width: 40px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--pdapp-loader-color1);
    clip-path: polygon(0 0,100% 0,100% 100%,0 100%);
    animation: pdapp_sshape_1 2s infinite cubic-bezier(0.3,1,0,1);
}
@keyframes pdapp_sshape_1 {
    33% {border-radius: 0;background: var(--pdapp-loader-color2) ;clip-path: polygon(0 0,100% 0,100% 100%,0 100%)}
    66% {border-radius: 0;background: var(--pdapp-loader-color3) ;clip-path: polygon(50% 0,50% 0,100% 100%,0 100%)}
}

.pdapp-sshape-2 {
    width: 40px;
    aspect-ratio: 1;
    background: var(--pdapp-loader-color1);
    clip-path: polygon(0 0,100% 0,100% 100%);
    animation: pdapp_sshape_2 2s infinite cubic-bezier(0.3,1,0,1);
}
@keyframes pdapp_sshape_2 {
    25%  {clip-path: polygon(0    0,100% 0   ,0 100%)}
    50%  {clip-path: polygon(0    0,100% 100%,0 100%)}
    75%  {clip-path: polygon(100% 0,100% 100%,0 100%)}
    100% {clip-path: polygon(100% 0,100% 100%,0 0   )}
}

.pdapp-sshape-3 {
    width: 50px;
    height: 50px;
    display: flex;
    transform: rotate(45deg);
    animation: pdapp_sshape_3-0 1.5s infinite linear;
}
.pdapp-sshape-3:before,
.pdapp-sshape-3:after {
    content: "";
    width: 50%;
    background: var(--pdapp-loader-color1);
    clip-path: polygon(0 50%,100% 0,100% 100%);
    animation: inherit;
    animation-name: pdapp_sshape_3-1;
}
.pdapp-sshape-3:after {
    clip-path: polygon(0 0,100% 50%,0% 100%);
    animation-name: pdapp_sshape_3-2;
}
@keyframes pdapp_sshape_3-0 {
    25% {width:50px;height:50px;transform:rotate(0)}
    50% {width:50px;height:50px}
    75% {width:70.70px;height:35.35px}
    100%{width:70.70px;height:35.35px;transform:rotate(0)}
}
@keyframes pdapp_sshape_3-1 {
    0%,25% {clip-path: polygon(0 50% ,100% 0,100% 100%);transform:translate(0.3px)}
    50%    {clip-path: polygon(0 50% ,100% 0,100% 100%);transform:translate(-5px)}
    75%    {clip-path: polygon(0 100%,0    0,100% 100%);transform:translate(-5px)}
    100%   {clip-path: polygon(0 100%,0    0,100% 100%);transform:translate(17.7px)}
}
@keyframes pdapp_sshape_3-2 {
    0%,25% {clip-path: polygon(0 0,100% 50%,0    100%);transform:translate(-0.3px) }
    50%    {clip-path: polygon(0 0,100% 50%,0    100%);transform:translate(5px) }
    75%    {clip-path: polygon(0 0,100% 0  ,100% 100%);transform:translate(5px)}
    100%   {clip-path: polygon(0 0,100% 0  ,100% 100%);transform:translate(-17.7px) }
}

.pdapp-sshape-4 {
    width: 40px;
    height: 40px;
    color: var(--pdapp-loader-color1);
    background:
        conic-gradient(from  -45deg at top    20px left 50% ,#0000 ,currentColor 1deg 90deg,#0000 91deg),
        conic-gradient(from   45deg at right  20px top  50% ,#0000 ,currentColor 1deg 90deg,#0000 91deg),
        conic-gradient(from  135deg at bottom 20px left 50% ,#0000 ,currentColor 1deg 90deg,#0000 91deg),
        conic-gradient(from -135deg at left   20px top  50% ,#0000 ,currentColor 1deg 90deg,#0000 91deg);
    animation: pdapp_sshape_4 1.5s infinite cubic-bezier(0.3,1,0,1);
}
@keyframes pdapp_sshape_4 {
    50%  {width:60px;height: 60px;transform: rotate(180deg)}
    100% {transform: rotate(360deg)}
}

.pdapp-sshape-5 {
    width: 40px;
    aspect-ratio: 1;
    color: var(--pdapp-loader-color1);
    position: relative;
    background:
        conic-gradient(from 134deg at top   ,currentColor 92deg,#0000 0) top,
        conic-gradient(from -46deg at bottom,currentColor 92deg,#0000 0) bottom;
    background-size: 100% 50%;
    background-repeat: no-repeat;
}
.pdapp-sshape-5:before {
    content:'';
    position: absolute;
    inset: 0;
    --g:currentColor 14.5px,#0000 0 calc(100% - 14.5px),currentColor 0;
    background:
        linear-gradient( 45deg,var(--g)),
        linear-gradient(-45deg,var(--g));
    animation: pdapp_sshape_5 1.5s infinite cubic-bezier(0.3,1,0,1);
}
@keyframes pdapp_sshape_5 {
    33%  {inset:-10px;transform: rotate(0deg)}
    66%  {inset:-10px;transform: rotate(90deg)}
    100% {inset:0    ;transform: rotate(90deg)}
}

.pdapp-sshape-6 {
    width: 40px;
    aspect-ratio: 1;
    color: var(--pdapp-loader-color1);
    position: relative;
    background: radial-gradient(10px,currentColor 94%,#0000);
}
.pdapp-sshape-6:before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background:
        radial-gradient(9px at bottom right,#0000 94%,currentColor) top    left,
        radial-gradient(9px at bottom left ,#0000 94%,currentColor) top    right,
        radial-gradient(9px at top    right,#0000 94%,currentColor) bottom left,
        radial-gradient(9px at top    left ,#0000 94%,currentColor) bottom right;
    background-size: 20px 20px;
    background-repeat: no-repeat;
    animation: pdapp_sshape_6 1.5s infinite cubic-bezier(0.3,1,0,1);
}
@keyframes pdapp_sshape_6 {
    33%  {inset:-10px;transform: rotate(0deg)}
    66%  {inset:-10px;transform: rotate(90deg)}
    100% {inset:0    ;transform: rotate(90deg)}
}

.pdapp-sshape-7 {
    width: 50px;
    aspect-ratio: 1;
    color: var(--pdapp-loader-color1);
    background: currentColor;
    border-radius: 50%;
    position: relative;
}
.pdapp-sshape-7:before {
    content: "";
    position: absolute;
    background:
        radial-gradient(farthest-side at bottom right,#0000 94%,currentColor 96%) 0    0   ,
        radial-gradient(farthest-side at bottom left ,#0000 94%,currentColor 96%) 100% 0   ,
        radial-gradient(farthest-side at top    left ,#0000 94%,currentColor 96%) 100% 100%,
        radial-gradient(farthest-side at top    right,#0000 94%,currentColor 96%) 0    100%;
    background-size: 25px 25px;
    background-repeat: no-repeat;
    animation: 
        pdapp_sshape_7-1 1s infinite,
        pdapp_sshape_7-2 1s infinite;
}
@keyframes pdapp_sshape_7-1 {
    0%,10%,90%,100% {inset:0}
    40%,60% {inset:-10px}
}
@keyframes pdapp_sshape_7-2 {
    0%,40%  {transform: rotate(0)}
    60%,100%{transform: rotate(90deg)}
}

.pdapp-sshape-8 {
    width: 60px;
    aspect-ratio: 1.154;
    --c: #0000 ,var(--pdapp-loader-color1) 2deg 59deg,#0000 61deg;
    --c1:conic-gradient(from 149deg at top   ,var(--c));
    --c2:conic-gradient(from -31deg at bottom,var(--c));
    background:
        var(--c1) top,
        var(--c1) bottom right,
        var(--c2) bottom,
        var(--c1) bottom left;
    background-size: 50% 50%;
    background-repeat: no-repeat;
    animation: pdapp_sshape_8 1s infinite;
}
@keyframes pdapp_sshape_8 {
    80%,100%{background-position: bottom right,bottom left,bottom,top}
}

.pdapp-sshape-9 {
    width: 50px;
    aspect-ratio: 1;
    color: var(--pdapp-loader-color1);
    position: relative;
    animation: pdapp_sshape_9 .5s infinite alternate;
}
.pdapp-sshape-9:before,
.pdapp-sshape-9:after {
    content: "";
    position: absolute;
    inset: 0;
    background-size: 25px 25px;
    background-position: 0 0,100% 0,100% 100%,0 100%;
    background-repeat: no-repeat;
}
.pdapp-sshape-9:before {
    background-image:
        radial-gradient(farthest-side at top    left ,currentColor 96%,#0000),
        radial-gradient(farthest-side at top    right,currentColor 96%,#0000),
        radial-gradient(farthest-side at bottom right,currentColor 96%,#0000),
        radial-gradient(farthest-side at bottom left ,currentColor 96%,#0000);
    animation: pdapp_sshape_9-1 1s infinite;
}
.pdapp-sshape-9:after {
    background-image: 
        radial-gradient(farthest-side at top    left ,#0000 94%,currentColor 96%),
        radial-gradient(farthest-side at top    right,#0000 94%,currentColor 96%),
        radial-gradient(farthest-side at bottom right,#0000 94%,currentColor 96%),
        radial-gradient(farthest-side at bottom left ,#0000 94%,currentColor 96%);
    animation: pdapp_sshape_9-2 1s infinite;
}
@keyframes pdapp_sshape_9-1 {
    0%,10%,90%,100% {inset:0}
    40%,60% {inset:-10px}
}
@keyframes pdapp_sshape_9-2 {
    0%,40%  {transform: rotate(0)}
    60%,100%{transform: rotate(90deg)}
}

.pdapp-sshape-10 {
    width: 40px;
    aspect-ratio: 1;
    animation: 
        pdapp_sshape_10-1 2s infinite linear,
        pdapp_sshape_10-2 3s infinite steps(1) -.5s;
}
@keyframes pdapp_sshape_10-1 {
    0%   {transform: perspective(150px) rotateX(  0deg) rotateY(0deg)}
    50%  {transform: perspective(150px) rotateX(180deg) rotateY(0deg)}
    100% {transform: perspective(150px) rotateX(180deg) rotateY(180deg)}
}
@keyframes pdapp_sshape_10-2 {
    0%  {background: var(--pdapp-loader-color1)}
    33% {background: var(--pdapp-loader-color2)}
    66% {background: var(--pdapp-loader-color3)}
}

.pdapp-sshape-11 {
    width: 60px;
    aspect-ratio: 1;
    display: grid;
    grid: 50%/50%;
    color: var(--pdapp-loader-color1); 
    border-radius: 50%;
    --_g: no-repeat linear-gradient(var(--pdapp-loader-color1) 0 0);
    background: var(--_g),var(--_g),var(--_g);
    background-size: 50.1% 50.1%;
    animation: 
        pdapp_sshape_11-0   1.5s infinite steps(1) alternate,
        pdapp_sshape_11-0-0 3s   infinite steps(1) alternate;
}
.pdapp-sshape-11::before {
    content: "";
    background: var(--pdapp-loader-color1);
    border-top-left-radius: 100px;
    transform: perspective(150px) rotateY(0deg) rotateX(0deg);
    transform-origin: bottom right; 
    animation: pdapp_sshape_11-1 1.5s infinite linear alternate;
}
@keyframes pdapp_sshape_11-0 {
    0%  {background-position: 0    100%,100% 100%,100% 0}
    33% {background-position: 100% 100%,100% 100%,100% 0}
    66% {background-position: 100% 0   ,100% 0   ,100% 0}
}
@keyframes pdapp_sshape_11-0-0 {
    0%  {transform: scaleX(1)  rotate(0deg)}
    50% {transform: scaleX(-1) rotate(-90deg)}
}
@keyframes pdapp_sshape_11-1 {
    16.5%{transform:perspective(150px) rotateX(-90deg)  rotateY(0deg)    rotateX(0deg);filter:grayscale(0.8)}
    33%  {transform:perspective(150px) rotateX(-180deg) rotateY(0deg)    rotateX(0deg)}
    66%  {transform:perspective(150px) rotateX(-180deg) rotateY(-180deg) rotateX(0deg)}
    100% {transform:perspective(150px) rotateX(-180deg) rotateY(-180deg) rotateX(-180deg);filter:grayscale(0.8)}
}

.pdapp-sshape-12 {
    width: 60px;
    aspect-ratio: 1;
    display: flex;
    animation: pdapp_sshape_12-0 2s infinite linear;
}
.pdapp-sshape-12::before,
.pdapp-sshape-12::after {
    content:"";
    flex:1;
    clip-path:polygon(100% 0,100% 100%,0 50%);
    animation: 
        pdapp_sshape_12-1 1s infinite linear alternate,
        pdapp_sshape_12-2 2s infinite linear -.5s;
}
.pdapp-sshape-12::after {
    --s:-1,-1;
}
@keyframes pdapp_sshape_12-0 {
    0%,49.99% {transform: scaleX(1)  rotate(0deg)}
    50%,100%  {transform: scaleX(-1) rotate(-90deg)}
}
@keyframes pdapp_sshape_12-1 {
    0%,
    5%   {transform:scale(var(--s,1)) translate(0px)   perspective(150px) rotateY(0deg) }
    33%  {transform:scale(var(--s,1)) translate(-10px) perspective(150px) rotateX(0deg) }
    66%  {transform:scale(var(--s,1)) translate(-10px) perspective(150px) rotateX(-180deg)}
    95%,
    100% {transform:scale(var(--s,1)) translate(0px)   perspective(150px) rotateX(-180deg)}
}
@keyframes pdapp_sshape_12-2 {
    0%,49.99% {background:var(--pdapp-loader-color1)}
    50%,100%  {background:var(--pdapp-loader-color2)}
}

.pdapp-sshape-13 {
    width: 40px;
    aspect-ratio: 1;
    background:
        linear-gradient(var(--pdapp-loader-color1) 0 0),
        linear-gradient(var(--pdapp-loader-color2) 0 0),
        var(--pdapp-loader-color1);
    background-repeat: no-repeat;
    animation: pdapp_sshape_13 1.5s infinite; 
}
@keyframes pdapp_sshape_13 {
    0%   {background-size:100%    0,0    100%}
    30%,
    50%  {background-size:100%    0,100% 100%}
    80%,
    100% {background-size:100% 100%,100% 100%}
}

.pdapp-sshape-14 {
    width: 28px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--pdapp-loader-color1);
    animation: pdapp_sshape_14 1.5s infinite;
}
@keyframes pdapp_sshape_14 {
    0%,
    100%{transform:translate(-35px);box-shadow:  0     0 var(--pdapp-loader-color2), 0     0 var(--pdapp-loader-color3)}
    40% {transform:translate( 35px);box-shadow: -15px  0 var(--pdapp-loader-color2),-30px  0 var(--pdapp-loader-color3)}
    50% {transform:translate( 35px);box-shadow:  0     0 var(--pdapp-loader-color2), 0     0 var(--pdapp-loader-color3)}
    90% {transform:translate(-35px);box-shadow:  15px  0 var(--pdapp-loader-color2), 30px  0 var(--pdapp-loader-color3)}
}

.pdapp-sshape-15 {
    width: 28px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--pdapp-loader-color1);
    transform-origin: top;
    display: grid;
    animation: pdapp_sshape_15-0 1s infinite linear;
}
.pdapp-sshape-15::before,
.pdapp-sshape-15::after {
    content: "";
    grid-area: 1/1;
    background:var(--pdapp-loader-color2);
    border-radius: 50%;
    transform-origin: top;
    animation: inherit;
    animation-name: pdapp_sshape_15-1;
}
.pdapp-sshape-15::after {
    background: var(--pdapp-loader-color3);
    --s:180deg;
}
@keyframes pdapp_sshape_15-0 {
    0%,20% {transform: rotate(0)}
    100%   {transform: rotate(360deg)}
}
@keyframes pdapp_sshape_15-1 {
    50% {transform: rotate(var(--s,90deg))}
    100% {transform: rotate(0)}
}

.pdapp-sshape-16 {
    width:28px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--pdapp-loader-color1);
    animation: pdapp_sshape_16 2s infinite;
}
@keyframes pdapp_sshape_16 {
    0%   {box-shadow: 
            0 -16px var(--pdapp-loader-color2), calc(16px*0.707) calc(-16px*0.707) var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}
    12.5%   {box-shadow: 
            0 0 var(--pdapp-loader-color2), calc(16px*0.707) calc(-16px*0.707) var(--pdapp-loader-color3),16px 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}
    25%   {box-shadow: 
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),16px 0 var(--pdapp-loader-color2), calc(16px*0.707) calc(16px*0.707) var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}
    37.5% {box-shadow: 
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), calc(16px*0.707) calc(16px*0.707) var(--pdapp-loader-color3),
            0 16px var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}
    50%   {box-shadow: 
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 16px var(--pdapp-loader-color2), calc(-16px*0.707) calc(16px*0.707) var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}
    62.5% {box-shadow: 
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), calc(-16px*0.707) calc(16px*0.707) var(--pdapp-loader-color3),-16px 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}
    75%   {box-shadow: 
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),-16px 0 var(--pdapp-loader-color2), calc(-16px*0.707) calc(-16px*0.707) var(--pdapp-loader-color3)}
    87.5% {box-shadow: 
            0 -16px var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), calc(-16px*0.707) calc(-16px*0.707) var(--pdapp-loader-color3)}
    100% {box-shadow: 
            0 -16px var(--pdapp-loader-color2), calc(16px*0.707) calc(-16px*0.707) var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}
}

.pdapp-sshape-17 {
    width: 22px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--pdapp-loader-color1);
    animation: pdapp_sshape_17 1.5s infinite linear;
}
@keyframes pdapp_sshape_17 {
    0%    {box-shadow: 
            0 -30px var(--pdapp-loader-color2), calc(30px*0.707) calc(-30px*0.707) var(--pdapp-loader-color3),30px 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}
    12.5% {box-shadow: 
            0 0 var(--pdapp-loader-color2), calc(30px*0.707) calc(-30px*0.707) var(--pdapp-loader-color3),30px 0 var(--pdapp-loader-color2), calc(30px*0.707) calc(30px*0.707) var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}
    25%   {box-shadow: 
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),30px 0 var(--pdapp-loader-color2), calc(30px*0.707) calc(30px*0.707) var(--pdapp-loader-color3),
            0 30px var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}
    37.5% {box-shadow: 
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), calc(30px*0.707) calc(30px*0.707) var(--pdapp-loader-color3),
            0 30px var(--pdapp-loader-color2), calc(-30px*0.707) calc(30px*0.707) var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}
    50%   {box-shadow: 
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 30px var(--pdapp-loader-color2), calc(-30px*0.707) calc(30px*0.707) var(--pdapp-loader-color3),-30px 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}
    62.5% {box-shadow: 
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), calc(-30px*0.707) calc(30px*0.707) var(--pdapp-loader-color3),-30px 0 var(--pdapp-loader-color2), calc(-30px*0.707) calc(-30px*0.707) var(--pdapp-loader-color3)}
    75%   {box-shadow: 
            0 -30px var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),-30px 0 var(--pdapp-loader-color2), calc(-30px*0.707) calc(-30px*0.707) var(--pdapp-loader-color3)}
    87.5% {box-shadow: 
            0 -30px var(--pdapp-loader-color2), calc(30px*0.707) calc(-30px*0.707) var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), calc(-30px*0.707) calc(-30px*0.707) var(--pdapp-loader-color3)}
    100%  {box-shadow: 
            0 -30px var(--pdapp-loader-color2), calc(30px*0.707) calc(-30px*0.707) var(--pdapp-loader-color3),30px 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),
            0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3),0 0 var(--pdapp-loader-color2), 0 0 var(--pdapp-loader-color3)}

}

/* Progress */
.pdapp-sprogress-1 {
    width: 120px;
    height: 20px;
    background:
    linear-gradient(var(--pdapp-loader-color1) 0 0) 0/0% no-repeat
    var(--pdapp-loader-color2);
    animation: pdapp_sprogress_1 2s infinite linear;
}
@keyframes pdapp_sprogress_1 {
    100% {background-size:100%}
}

.pdapp-sprogress-2 {
    width: 120px;
    height: 20px;
    border-radius: 20px;
    background:
    linear-gradient(var(--pdapp-loader-color1) 0 0) 0/0% no-repeat
    var(--pdapp-loader-color2);
    animation: pdapp_sprogress_2 2s infinite steps(10);
}
@keyframes pdapp_sprogress_2 {
    100% {background-size:110%}
}

.pdapp-sprogress-3 {
    width: 120px;
    height: 20px;
    border-radius: 20px;
    background:
    repeating-linear-gradient(135deg,var(--pdapp-loader-color1) 0 10px,var(--pdapp-loader-color2) 0 20px) 0/0%   no-repeat,
    repeating-linear-gradient(135deg,var(--pdapp-loader-color4)    0 10px,var(--pdapp-loader-color3)    0 20px) 0/100%;
    animation: pdapp_sprogress_3 2s infinite;
}
@keyframes pdapp_sprogress_3 {
    100% {background-size:100%}
}

.pdapp-sprogress-4 {
    width: 120px;
    height: 20px;
    -webkit-mask:linear-gradient(90deg,var(--pdapp-loader-color1) 70%,#0000 0) 0/20%;
    background:
    linear-gradient(var(--pdapp-loader-color1) 0 0) 0/0% no-repeat
    var(--pdapp-loader-color2);
    animation: pdapp_sprogress_4 2s infinite steps(6);
}
@keyframes pdapp_sprogress_4 {
    100% {background-size:120%}
}

.pdapp-sprogress-5 {
    width: 80px;
    height: 40px;
    color: var(--pdapp-loader-color1);
    border: 2px solid var(--pdapp-loader-color1);
    border-right-color: transparent;
    padding: 3px;
    background: 
        repeating-linear-gradient(90deg,var(--pdapp-loader-color1) 0 10px,#0000 0 15px) 
        0/0% no-repeat content-box content-box;
    position: relative;
    box-sizing: border-box;
    animation: pdapp_sprogress_5 2s infinite steps(6);
}
.pdapp-sprogress-5::before {
    content: "";
    position: absolute;
    top: -2px;
    bottom: -2px;
    left: 100%;
    width: 10px;
    background:
        linear-gradient(
            #0000   calc(50% - 7px),var(--pdapp-loader-color1) 0 calc(50% - 5px),
            #0000 0 calc(50% + 5px),var(--pdapp-loader-color1) 0 calc(50% + 7px),#0000 0) left /100% 100%,
        linear-gradient(var(--pdapp-loader-color1) calc(50% - 5px),#0000        0 calc(50% + 5px),var(--pdapp-loader-color1) 0) left /2px 100%,
        linear-gradient(#0000        calc(50% - 5px),var(--pdapp-loader-color1) 0 calc(50% + 5px),#0000        0) right/2px 100%;
    background-repeat:no-repeat;
}
@keyframes pdapp_sprogress_5 {
    100% {background-size:120%}
}

.pdapp-sprogress-6 {
    width: 120px;
    height: 22px;
    border-radius: 20px;
    color: var(--pdapp-loader-color1);
    border: 2px solid;
    position: relative;
}
.pdapp-sprogress-6::before {
    content: "";
    position: absolute;
    margin: 2px;
    inset: 0 100% 0 0;
    border-radius: inherit;
    background: var(--pdapp-loader-color1);
    animation: pdapp_sprogress_6 2s infinite;
}
@keyframes pdapp_sprogress_6 {
    100% {inset:0}
}

.pdapp-sprogress-7 {
    width: 60px;
    aspect-ratio: 1;
    border-radius: 50%;
    -webkit-mask:linear-gradient(0deg,var(--pdapp-loader-color1) 55%,#0000 0) bottom/100% 18.18%;
    background:
    linear-gradient(var(--pdapp-loader-color1) 0 0) bottom/100% 0% no-repeat
    var(--pdapp-loader-color2);
    animation: pdapp_sprogress_7 2s infinite steps(7);
}
@keyframes pdapp_sprogress_7 {
    100% {background-size:100% 115%}
}

.pdapp-sprogress-8 {
    width: 60px;
    height: 50px;
    --m:no-repeat linear-gradient(90deg,var(--pdapp-loader-color1) 70%,#0000 0);
    -webkit-mask: 
        var(--m) calc(0*100%/4) 100%/calc(100%/5) calc(1*100%/5),
        var(--m) calc(1*100%/4) 100%/calc(100%/5) calc(2*100%/5),
        var(--m) calc(2*100%/4) 100%/calc(100%/5) calc(3*100%/5),
        var(--m) calc(3*100%/4) 100%/calc(100%/5) calc(4*100%/5),
        var(--m) calc(4*100%/4) 100%/calc(100%/5) calc(5*100%/5);
    background: linear-gradient(var(--pdapp-loader-color1) 0 0) left/0% 100% no-repeat var(--pdapp-loader-color2);
    animation: pdapp_sprogress_8 2s infinite steps(6);
}
@keyframes pdapp_sprogress_8 {
    100% {background-size: 120% 100%}
}

.pdapp-sprogress-9 {
    height: 4px;
    width: 130px;
    --c:no-repeat linear-gradient(var(--pdapp-loader-color1) 0 0);
    background: var(--c),var(--c),var(--pdapp-loader-color2);
    background-size: 60% 100%;
    animation: pdapp_sprogress_9 3s infinite;
}
@keyframes pdapp_sprogress_9 {
    0%   {background-position:-150% 0,-150% 0}
    66%  {background-position: 250% 0,-150% 0}
    100% {background-position: 250% 0, 250% 0}
}

.pdapp-sprogress-10 {
    width: 120px;
    height: 20px;
    background: 
        linear-gradient(90deg,var(--pdapp-loader-color11) 33%,var(--pdapp-loader-color15) 50%,var(--pdapp-loader-color11) 66%)
        var(--pdapp-loader-color2);
    background-size:300% 100%;
    animation: pdapp_sprogress_10 1s infinite linear;
}
@keyframes pdapp_sprogress_10 {
    0% {background-position: right}
}

.pdapp-sprogress-11 {
    width: 120px;
    height: 20px;
    background: 
        linear-gradient(90deg, #0000 ,var(--pdapp-loader-color1)) left -50px top 0/50px 20px no-repeat 
        var(--pdapp-loader-color2);
    animation: pdapp_sprogress_11 1s infinite linear;
}
@keyframes pdapp_sprogress_11 {
    100% {background-position: right -50px top 0}
}

.pdapp-sprogress-12 {
    width: 120px;
    height: 22px;
    border-radius: 40px;
    color: var(--pdapp-loader-color1);
    border: 2px solid;
    position: relative;
    overflow: hidden;
}
.pdapp-sprogress-12::before {
    content: "";
    position: absolute;
    margin: 2px;
    width: 14px;
    top: 0;
    bottom: 0;
    left: -20px;
    border-radius: inherit;
    background: var(--pdapp-loader-color1);
    box-shadow: -10px 0 12px 3px var(--pdapp-loader-color1);
    clip-path: polygon(0 5%, 100% 0,100% 100%,0 95%,-30px 50%);
    animation: pdapp_sprogress_12 1s infinite linear;
}
@keyframes pdapp_sprogress_12 {
    100% {left: calc(100% + 20px)}
}

.pdapp-sprogress-13 {
    width: 120px;
    height: 20px;
    -webkit-mask: linear-gradient(90deg,var(--pdapp-loader-color1) 70%,#0000 0) left/20% 100%;
    background:
    linear-gradient(var(--pdapp-loader-color1) 0 0) left -25% top 0 /20% 100% no-repeat
    var(--pdapp-loader-color2);
    animation: pdapp_sprogress_13 1s infinite steps(6);
}
@keyframes pdapp_sprogress_13 {
    100% {background-position: right -25% top 0}
}