/* @import url('../static/icon/iconfont.css'); */
*{
    margin: 0;
    padding: 0;
    user-select: none;
}
/* WebKit内核浏览器（Chrome/Safari/Edge）专用语法 */
::-webkit-scrollbar {
    width: 6px;        /* 垂直滚动条宽度 */
}
::-webkit-scrollbar-track {
    background-color: #101111;
}
::-webkit-scrollbar-thumb {
    background: #ffffff;  /* 滑块颜色 */
    border-radius: 100vw;   /* 滑块圆角 */
}
::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;  /* 悬停状态颜色 */
}
/*去除未被访问的a标签的下划线*/
a:link {
    text-decoration: none;
    color: #000;
}
/*去除已经被访问过的a标签的下划线*/
a:visited {
    text-decoration: none;
    color: #000;
}
/*去除鼠标悬停时的a标签的下划线*/
a:hover {
    text-decoration: none;
    color: #000;
}
/*去除正在点击的a标签的下划线（鼠标按下，尚未松开）*/
a:active {
    text-decoration: none;
    color: #000;
}
/*去除获得焦点的a标签的下划线（被鼠标点击过）*/
a:focus {
    text-decoration: none;
    color: #000;
}

.loader-overlay {
    position: fixed;
    z-index: 99999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: #f3f4f6;
    /* background-color: #020617; */
    background: 
    radial-gradient(circle at 50% 50%, rgba(30, 58, 138, 0.2) 0%, transparent 60%),
    radial-gradient(circle at 50% 50%, #020617 30%, #000000 100%);
    display: flex;
    justify-content: center;
    align-items: center;
    user-select: none;
    box-sizing: border-box;
    transition: opacity 1s cubic-bezier(0.25, 1, 0.5, 1), visibility 1s;
}
.loader-overlay.fade-out {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
.loader-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}
.aperture{
    position: absolute;
    z-index: -1;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 70vh;
    height: 70vh;
    border-radius: 50%;
    opacity: 0;
    transition: opacity 1s;
    animation: aperture_opacity 1s 0.2s both;
}
.aperture .aperture_1{
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: rotate(-180deg);
    transform-origin: 50% 50%;
    opacity: 1;
    scale: 0.97;
    animation: aperture_scale 4s 0.2s both;
}
.aperture .aperture_1::before,.aperture .aperture_1::after{
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 50%;
    will-change: transform;
    backface-visibility: hidden;
    transform: translateZ(0);
}
.aperture .aperture_1::before{
    box-shadow: 0px -1.564vh 1.816vh -1.473vh #fff;
}
.aperture .aperture_1::after{
    box-shadow: 0px 1.564vh 1.816vh -1.473vh #fff inset;
}
.loader-status {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 8px; /* 标题和副标题的间距 */
    margin-bottom: 20px;
    /* 强制使用等宽字体，看起来更有控制台感 */
    font-family: 'Segoe UI Mono', 'Roboto Mono', 'Courier New', monospace;
}
.status-title {
    font-size: 22px;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: 0.4em; /* 极宽的间距，模拟高端显示器 */
    text-transform: uppercase; /* 强制大写 */
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
}
.status-title::after {
    content: " ■"; /* 在标题后加一个小的填充方块，像极了终端输入光标 */
    animation: cursor-blink 1s infinite;
}

@keyframes cursor-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}
.status-subtitle {
    font-size: 12px;
    font-weight: 300;
    color: #64748b; /* 低饱和度的灰色，平衡白色标题的视觉重心 */
    letter-spacing: 0.2em;
    text-transform: uppercase;
    opacity: 0.8;
}
.loader_number_container{
    display: flex;
    justify-content: center;
    align-items: center;
}
.progress-fill {
    height: 100%;
    background-color: #22d3ee; 
    box-shadow: 0 0 8px rgba(34, 211, 238, 0.7);
    transition: width 0.3s ease-out;
}
.progress-percent {
    font-size: 18px;
    color: #8b9bb4;
    letter-spacing: 1px;
}
.progress-percent {
    font-family: 'Space Mono', 'Courier New', monospace; /* 必须用等宽字体，保证数字跳动时不乱跑 */
    font-size: 32px;        /* 显著放大，作为界面的视觉中心 */
    font-weight: 700;
    color: #fff;            /* 纯白，突出核心进度 */
    letter-spacing: 2px;    /* 稍微拉开间距 */
    font-variant-numeric: tabular-nums; /* 关键点：防止数字跳动时文字宽度抖动 */
    
    /* 添加微弱的荧光感 */
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
    
    /* 增加过渡，让数字变化更丝滑 */
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    
    /* 配合你的闪烁点，保持对齐 */
    display: flex;
    align-items: baseline;
}
/* 如果你想加上“%”符号的特殊处理 */
.progress-percent::after {
    content: "%";
    font-size: 16px;        /* 符号缩小，显得更有设计感 */
    margin-left: 4px;
    color: #64748b;         /* 符号颜色变暗，突出主数字 */
}
@keyframes aperture_opacity {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes loader_number_point {
    0% { opacity: 0.2; transform: scale(0.8); }
    50% { opacity: 1; transform: scale(1.1); box-shadow: 0 0 12px #00f2ff; }
    100% { opacity: 0.2; transform: scale(0.8); }
}

@keyframes aperture_scale {
    0% {
        scale: 0.97;
        transform: rotate(-180deg);
    }
    100% {
        scale: 1;
        transform: rotate(0deg);
    }
}


.btn-reset {
  /* 1. 清除浏览器默认的外观样式 */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;

  /* 2. 恢复为 div 的块级布局（button 默认是 inline-block） */
  display: block;
  box-sizing: content-box; /* 标准 div 默认是 content-box */
  width: auto;
  height: auto;

  /* 3. 清除外边距和内边距 */
  margin: 0;
  padding: 0;

  /* 4. 清除边框和背景 */
  border: none;
  border-radius: 0;
  background: transparent;
  background-color: transparent;

  /* 5. 继承父级的文本样式（button 默认有自己的字体和对齐方式） */
  font: inherit;
  color: inherit;
  line-height: inherit;
  text-align: inherit;
  letter-spacing: inherit;
  text-transform: none;
  text-shadow: none;

  /* 6. 恢复文本换行行为 */
  white-space: normal;
  word-spacing: normal;

  /* 7. 恢复默认的鼠标指针和用户选择行为 */
  cursor: default;
  -webkit-user-select: auto;
  -moz-user-select: auto;
  -ms-user-select: auto;
  user-select: auto;

  /* 8. 清除点击时的阴影、高亮及焦点框 */
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

/* 9. 清除激活（按下）和聚焦状态下的默认样式 */
.btn-reset:focus,
.btn-reset:active {
  outline: none;
  background: transparent;
}

/* 10. 针对 Firefox 的特殊兼容处理 */
.btn-reset::-moz-focus-inner {
  border: 0;
  padding: 0;
}