用户:汐际/签名/style.css

/* 整体可见性：0~68.75% 可见，之后 5s 整体隐藏 */
@keyframes saturn-sig-cycle {
  0%      { opacity: 1; }
  68.75%  { opacity: 0; }
  100%    { opacity: 0; }
}

/* 底座：不规律电火花节奏 */
@keyframes saturn-base-cycle {
  0%, 0.08%, 0.14%, 0.22%, 0.30%, 0.40%, 0.50%, 0.60%, 0.72%, 0.86% { background:#05080a; }
  0.04%, 0.10%, 0.16%, 0.26%, 0.34%, 0.46%, 0.54%, 0.66%, 0.80%, 0.94% { background:#1b2228; }
  3.125%, 65.625% { background:#1b2228; }
  65.72%, 65.86%, 66.04%, 66.24%, 66.48%, 66.72% { background:#05080a; }
  65.78%, 65.94%, 66.14%, 66.36%, 66.60%, 66.86% { background:#1b2228; }
  68.75%, 100% { background:#1b2228; }
}

/* 顶部长条：与底座错开相位 */
@keyframes saturn-bar-cycle {
  0%, 0.04%, 0.10%, 0.16%, 0.26%, 0.34%, 0.46%, 0.54%, 0.66%, 0.80%, 0.94% { background:rgba(13,140,187,.08); }
  0.02%, 0.06%, 0.12%, 0.20%, 0.30%, 0.40%, 0.50%, 0.60%, 0.72%, 0.86% { background:rgba(13,140,187,.4); }
  3.125%, 65.625% { background:rgba(13,140,187,.4); }
  65.66%, 65.80%, 65.98%, 66.18%, 66.42%, 66.66% { background:rgba(13,140,187,.08); }
  65.72%, 65.86%, 66.06%, 66.28%, 66.54%, 66.80% { background:rgba(13,140,187,.4); }
  68.75%, 100% { background:rgba(13,140,187,.4); }
}

/* 标签：25 次硬切（0.5s 内） */
@keyframes saturn-tag-cycle {
  0%,0.125%,0.25%,0.375%,0.5%,0.625%,0.75%,0.875%,1%,1.125%,1.25%,1.375%,1.5%,1.625%,1.75%,1.875%,2%,2.125%,2.25%,2.375%,2.5%,2.625%,2.75%,2.875%,3% { opacity:0; }
  0.0625%,0.1875%,0.3125%,0.4375%,0.5625%,0.6875%,0.8125%,0.9375%,1.0625%,1.1875%,1.3125%,1.4375%,1.5625%,1.6875%,1.8125%,1.9375%,2.0625%,2.1875%,2.3125%,2.4375%,2.5625%,2.6875%,2.8125%,2.9375%,3.0625%,3.125%,65.625% { opacity:1; }
  65.6875%,65.8125%,65.9375%,66.0625%,66.1875%,66.3125%,66.4375%,66.5625%,66.6875%,66.8125%,66.9375%,67.0625%,67.1875%,67.3125%,67.4375%,67.5625%,67.6875%,67.8125%,67.9375%,68.0625%,68.1875%,68.3125%,68.4375%,68.5625%,68.6875%,68.75%,100% { opacity:0; }
  65.75%,65.875%,66%,66.125%,66.25%,66.375%,66.5%,66.625%,66.75%,66.875%,67%,67.125%,67.25%,67.375%,67.5%,67.625%,67.75%,67.875%,68%,68.125%,68.25%,68.375%,68.5%,68.625% { opacity:1; }
}

@keyframes sci-fi-scan {
  0%     { transform: translateY(0); }
  41.67% { transform: translateY(-267%); }
  100%   { transform: translateY(-267%); }
}

@keyframes faithful-content-cycle {
  0%, 45%   { opacity: 1; visibility: visible; }
  50%, 95%  { opacity: 0; visibility: hidden; }
  100%      { opacity: 1; visibility: visible; }
}
@keyframes faithful-badges-cycle {
  0%, 45%   { opacity: 0; visibility: hidden; }
  50%, 95%  { opacity: 1; visibility: visible; }
  100%      { opacity: 0; visibility: hidden; }
}

@keyframes pixel-flicker {
  0%, 18%   { opacity: 1; }
  19%, 26%  { opacity: 0.45; }
  27%, 52%  { opacity: 1; }
  53%, 58%  { opacity: 0.7; }
  59%, 64%  { opacity: 0.3; }
  65%, 82%  { opacity: 1; }
  83%, 87%  { opacity: 0.55; }
  88%, 100% { opacity: 1; }
}

@keyframes pixel-jitter {
  0%,12.4%   { transform: translate(0,0) scale(1,1); }
  12.5%,24.9% { transform: translate(0.5px,-0.5px) scale(1.01,0.99); }
  25%,37.4%  { transform: translate(-0.5px,0.5px) scale(0.99,1.01); }
  37.5%,49.9% { transform: translate(1px,0) scale(1,1.005); }
  50%,62.4%  { transform: translate(-1px,-0.5px) scale(1.005,1); }
  62.5%,74.9% { transform: translate(0.5px,1px) scale(0.995,1.005); }
  75%,87.4%  { transform: translate(-0.5px,-1px) scale(1.01,0.99); }
  87.5%,100% { transform: translate(0,0) scale(1,1); }
}

@keyframes pixel-erosion {
  0%,8.3%    { clip-path: polygon(20% 0%, 80% 0%, 85% 5%, 78% 10%, 88% 15%, 82% 22%, 90% 30%, 78% 38%, 88% 45%, 82% 52%, 92% 60%, 80% 68%, 88% 76%, 78% 84%, 85% 92%, 80% 100%, 20% 100%, 15% 92%, 22% 84%, 12% 76%, 18% 68%, 8% 60%, 20% 52%, 12% 45%, 22% 38%, 10% 30%, 20% 22%, 15% 15%, 22% 10%, 15% 5%); }
  8.4%,16.6% { clip-path: polygon(25% 0%, 75% 0%, 90% 6%, 80% 12%, 85% 18%, 78% 25%, 92% 32%, 82% 40%, 90% 48%, 80% 55%, 88% 62%, 78% 70%, 90% 78%, 82% 86%, 88% 94%, 75% 100%, 25% 100%, 12% 94%, 20% 86%, 10% 78%, 22% 70%, 12% 62%, 20% 55%, 10% 48%, 18% 40%, 8% 32%, 22% 25%, 15% 18%, 20% 12%, 10% 6%); }
  16.7%,24.9% { clip-path: polygon(15% 0%, 85% 0%, 80% 4%, 90% 10%, 82% 16%, 88% 24%, 78% 32%, 92% 40%, 80% 48%, 88% 56%, 78% 64%, 90% 72%, 82% 80%, 88% 88%, 80% 96%, 85% 100%, 15% 100%, 20% 96%, 12% 88%, 20% 80%, 10% 72%, 22% 64%, 12% 56%, 20% 48%, 8% 40%, 22% 32%, 12% 24%, 20% 16%, 10% 10%, 20% 4%); }
  25%,33.2%  { clip-path: polygon(22% 0%, 78% 0%, 85% 8%, 75% 14%, 88% 20%, 82% 28%, 90% 36%, 78% 44%, 88% 52%, 80% 58%, 90% 66%, 82% 74%, 88% 82%, 78% 90%, 85% 96%, 78% 100%, 22% 100%, 15% 96%, 22% 90%, 12% 82%, 18% 74%, 10% 66%, 20% 58%, 12% 52%, 22% 44%, 10% 36%, 18% 28%, 12% 20%, 25% 14%, 15% 8%); }
  33.3%,41.6% { clip-path: polygon(18% 0%, 82% 0%, 90% 5%, 82% 12%, 90% 20%, 80% 28%, 92% 35%, 82% 42%, 90% 50%, 80% 58%, 92% 65%, 82% 72%, 90% 80%, 80% 88%, 92% 95%, 82% 100%, 18% 100%, 10% 95%, 18% 88%, 8% 80%, 20% 72%, 8% 65%, 18% 58%, 8% 50%, 20% 42%, 8% 35%, 18% 28%, 10% 20%, 18% 12%, 10% 5%); }
  41.7%,49.9% { clip-path: polygon(20% 0%, 80% 0%, 88% 6%, 80% 14%, 88% 22%, 78% 30%, 90% 38%, 78% 46%, 88% 54%, 80% 62%, 90% 70%, 80% 78%, 88% 86%, 80% 94%, 88% 100%, 12% 100%, 20% 94%, 12% 86%, 20% 78%, 10% 70%, 22% 62%, 10% 54%, 22% 46%, 10% 38%, 22% 30%, 10% 22%, 22% 14%, 12% 6%); }
  50%,58.2%  { clip-path: polygon(25% 0%, 75% 0%, 90% 8%, 78% 14%, 88% 22%, 80% 30%, 92% 38%, 82% 46%, 90% 54%, 78% 62%, 90% 70%, 80% 78%, 92% 86%, 82% 94%, 80% 100%, 20% 100%, 10% 94%, 22% 86%, 10% 78%, 20% 70%, 10% 62%, 22% 54%, 10% 46%, 20% 38%, 10% 30%, 22% 22%, 12% 14%, 22% 8%); }
  58.3%,66.6% { clip-path: polygon(15% 0%, 85% 0%, 78% 6%, 90% 14%, 80% 22%, 88% 30%, 78% 38%, 90% 46%, 80% 54%, 88% 62%, 80% 70%, 92% 78%, 82% 86%, 88% 94%, 80% 100%, 20% 100%, 12% 94%, 22% 86%, 10% 78%, 22% 70%, 10% 62%, 20% 54%, 10% 46%, 22% 38%, 10% 30%, 20% 22%, 10% 14%, 22% 6%); }
  66.7%,74.9% { clip-path: polygon(18% 0%, 82% 0%, 88% 5%, 78% 12%, 90% 18%, 80% 26%, 90% 34%, 80% 42%, 88% 50%, 80% 58%, 90% 66%, 80% 74%, 88% 82%, 78% 90%, 88% 96%, 82% 100%, 18% 100%, 12% 96%, 22% 90%, 12% 82%, 20% 74%, 10% 66%, 22% 58%, 10% 50%, 20% 42%, 10% 34%, 22% 26%, 10% 18%, 22% 12%, 12% 5%); }
  75%,83.2%  { clip-path: polygon(22% 0%, 78% 0%, 90% 7%, 80% 14%, 90% 21%, 80% 29%, 92% 37%, 82% 45%, 90% 53%, 80% 61%, 92% 69%, 82% 77%, 90% 85%, 80% 93%, 88% 100%, 12% 100%, 20% 93%, 10% 85%, 20% 77%, 10% 69%, 22% 61%, 10% 53%, 22% 45%, 10% 37%, 22% 29%, 10% 21%, 20% 14%, 10% 7%); }
  83.3%,91.6% { clip-path: polygon(20% 0%, 80% 0%, 85% 4%, 90% 12%, 80% 20%, 90% 28%, 80% 36%, 90% 44%, 80% 52%, 90% 60%, 80% 68%, 90% 76%, 80% 84%, 90% 92%, 80% 100%, 20% 100%, 10% 92%, 20% 84%, 10% 76%, 20% 68%, 10% 60%, 20% 52%, 10% 44%, 20% 36%, 10% 28%, 20% 20%, 10% 12%, 15% 4%); }
  91.7%,100% { clip-path: polygon(20% 0%, 80% 0%, 85% 5%, 78% 10%, 88% 15%, 82% 22%, 90% 30%, 78% 38%, 88% 45%, 82% 52%, 92% 60%, 80% 68%, 88% 76%, 78% 84%, 85% 92%, 80% 100%, 20% 100%, 15% 92%, 22% 84%, 12% 76%, 18% 68%, 8% 60%, 20% 52%, 12% 45%, 22% 38%, 10% 30%, 20% 22%, 15% 15%, 22% 10%, 15% 5%); }
}

@keyframes pixel-torn-edge {
  0%    { clip-path: polygon(95% 0%, 95% 10%, 96% 10%, 96% 20%, 94% 20%, 94% 30%, 95% 30%, 95% 40%, 94% 40%, 94% 50%, 96% 50%, 96% 60%, 95% 60%, 95% 70%, 94% 70%, 94% 80%, 96% 80%, 96% 90%, 94% 90%, 94% 100%, 100% 100%, 100% 0%); }
  12.5% { clip-path: polygon(94% 0%, 94% 10%, 95% 10%, 95% 20%, 96% 20%, 96% 30%, 94% 30%, 94% 40%, 95% 40%, 95% 50%, 96% 50%, 96% 60%, 94% 60%, 94% 70%, 95% 70%, 95% 80%, 96% 80%, 96% 90%, 94% 90%, 94% 100%, 100% 100%, 100% 0%); }
  25%   { clip-path: polygon(96% 0%, 96% 10%, 94% 10%, 94% 20%, 95% 20%, 95% 30%, 96% 30%, 96% 40%, 94% 40%, 94% 50%, 95% 50%, 95% 60%, 96% 60%, 96% 70%, 94% 70%, 94% 80%, 95% 80%, 95% 90%, 96% 90%, 96% 100%, 100% 100%, 100% 0%); }
  37.5% { clip-path: polygon(95% 0%, 95% 10%, 96% 10%, 96% 20%, 94% 20%, 94% 30%, 95% 30%, 95% 40%, 96% 40%, 96% 50%, 94% 50%, 94% 60%, 95% 60%, 95% 70%, 96% 70%, 96% 80%, 94% 80%, 94% 90%, 95% 90%, 95% 100%, 100% 100%, 100% 0%); }
  50%   { clip-path: polygon(94% 0%, 94% 10%, 94% 10%, 94% 20%, 96% 20%, 96% 30%, 95% 30%, 95% 40%, 94% 40%, 94% 50%, 96% 50%, 96% 60%, 95% 60%, 95% 70%, 94% 70%, 94% 80%, 96% 80%, 96% 90%, 95% 90%, 95% 100%, 100% 100%, 100% 0%); }
  62.5% { clip-path: polygon(96% 0%, 96% 10%, 95% 10%, 95% 20%, 94% 20%, 94% 30%, 96% 30%, 96% 40%, 95% 40%, 95% 50%, 94% 50%, 94% 60%, 96% 60%, 96% 70%, 95% 70%, 95% 80%, 94% 80%, 94% 90%, 96% 90%, 96% 100%, 100% 100%, 100% 0%); }
  75%   { clip-path: polygon(95% 0%, 95% 10%, 94% 10%, 94% 20%, 96% 20%, 96% 30%, 94% 30%, 94% 40%, 95% 40%, 95% 50%, 96% 50%, 96% 60%, 94% 60%, 94% 70%, 95% 70%, 95% 80%, 96% 80%, 96% 90%, 94% 90%, 94% 100%, 100% 100%, 100% 0%); }
  87.5% { clip-path: polygon(94% 0%, 94% 10%, 96% 10%, 96% 20%, 95% 20%, 95% 30%, 94% 30%, 94% 40%, 96% 40%, 96% 50%, 95% 50%, 95% 60%, 94% 60%, 94% 70%, 96% 70%, 96% 80%, 95% 80%, 95% 90%, 94% 90%, 94% 100%, 100% 100%, 100% 0%); }
  100%  { clip-path: polygon(95% 0%, 95% 10%, 96% 10%, 96% 20%, 94% 20%, 94% 30%, 95% 30%, 95% 40%, 94% 40%, 94% 50%, 96% 50%, 96% 60%, 95% 60%, 95% 70%, 94% 70%, 94% 80%, 96% 80%, 96% 90%, 94% 90%, 94% 100%, 100% 100%, 100% 0%); }
}

@keyframes red-region {
  0%    { clip-path: polygon(0 0, 84% 0, 84% 12.5%, 85% 12.5%, 85% 25%, 84% 25%, 84% 37.5%, 86% 37.5%, 86% 50%, 84% 50%, 84% 62.5%, 85% 62.5%, 85% 75%, 84% 75%, 84% 87.5%, 85% 87.5%, 85% 100%, 0 100%); }
  25%   { clip-path: polygon(0 0, 85% 0, 85% 12.5%, 84% 12.5%, 84% 25%, 86% 25%, 86% 37.5%, 84% 37.5%, 84% 50%, 85% 50%, 85% 62.5%, 84% 62.5%, 84% 75%, 86% 75%, 86% 87.5%, 84% 87.5%, 84% 100%, 0 100%); }
  50%   { clip-path: polygon(0 0, 86% 0, 86% 12.5%, 85% 12.5%, 85% 25%, 84% 25%, 84% 37.5%, 85% 37.5%, 85% 50%, 86% 50%, 86% 62.5%, 85% 62.5%, 85% 75%, 84% 75%, 84% 87.5%, 85% 87.5%, 85% 100%, 0 100%); }
  75%   { clip-path: polygon(0 0, 85% 0, 85% 12.5%, 86% 12.5%, 86% 25%, 84% 25%, 84% 37.5%, 85% 37.5%, 85% 50%, 84% 50%, 84% 62.5%, 86% 62.5%, 86% 75%, 84% 75%, 84% 87.5%, 85% 87.5%, 85% 100%, 0 100%); }
  100%  { clip-path: polygon(0 0, 84% 0, 84% 12.5%, 85% 12.5%, 85% 25%, 84% 25%, 84% 37.5%, 86% 37.5%, 86% 50%, 84% 50%, 84% 62.5%, 85% 62.5%, 85% 75%, 84% 75%, 84% 87.5%, 85% 87.5%, 85% 100%, 0 100%); }
}

@keyframes black-bar {
  0%    { clip-path: polygon(88% 0, 100% 0, 100% 100%, 88% 100%, 88% 87.5%, 87% 87.5%, 87% 75%, 88% 75%, 88% 62.5%, 87% 62.5%, 87% 50%, 88% 50%, 88% 37.5%, 87% 37.5%, 87% 25%, 88% 25%, 88% 12.5%, 87% 12.5%, 87% 0); }
  25%   { clip-path: polygon(87% 0, 100% 0, 100% 100%, 87% 100%, 87% 87.5%, 88% 87.5%, 88% 75%, 87% 75%, 87% 62.5%, 88% 62.5%, 88% 50%, 87% 50%, 87% 37.5%, 88% 37.5%, 88% 25%, 87% 25%, 87% 12.5%, 88% 12.5%, 88% 0); }
  50%   { clip-path: polygon(89% 0, 100% 0, 100% 100%, 89% 100%, 89% 87.5%, 88% 87.5%, 88% 75%, 89% 75%, 89% 62.5%, 88% 62.5%, 88% 50%, 89% 50%, 89% 37.5%, 88% 37.5%, 88% 25%, 89% 25%, 89% 12.5%, 88% 12.5%, 88% 0); }
  75%   { clip-path: polygon(87% 0, 100% 0, 100% 100%, 87% 100%, 87% 87.5%, 89% 87.5%, 89% 75%, 87% 75%, 87% 62.5%, 89% 62.5%, 89% 50%, 87% 50%, 87% 37.5%, 89% 37.5%, 89% 25%, 87% 25%, 87% 12.5%, 89% 12.5%, 89% 0); }
  100%  { clip-path: polygon(88% 0, 100% 0, 100% 100%, 88% 100%, 88% 87.5%, 87% 87.5%, 87% 75%, 88% 75%, 88% 62.5%, 87% 62.5%, 87% 50%, 88% 50%, 88% 37.5%, 87% 37.5%, 87% 25%, 88% 25%, 88% 12.5%, 87% 12.5%, 87% 0); }
}

@keyframes inner-warp {
  0%    { transform: translate(0, 0); opacity: 0.4; }
  33%   { transform: translate(8px, -2px); opacity: 0.7; }
  66%   { transform: translate(-4px, 3px); opacity: 0.3; }
  100%  { transform: translate(0, 0); opacity: 0.4; }
}

@keyframes inner-warp2 {
  0%    { transform: translate(0, 0); opacity: 0.5; }
  33%   { transform: translate(-5px, 4px); opacity: 0.8; }
  66%   { transform: translate(3px, -3px); opacity: 0.3; }
  100%  { transform: translate(0, 0); opacity: 0.5; }
}