.markdown-section iframe[src*='buttons.github.io'] {
  margin: 0;
}

figure.thumbnails img {
  margin: 0.75em 0;
  border-radius: 3px;
  box-shadow:
    0 2px 6px rgba(0, 0, 0, 0.1),
    0 4px 12px rgba(0, 0, 0, 0.15);
}

@media (min-width: 30em) {
  figure.thumbnails:after {
    content: '';
    display: table;
    clear: both;
  }

  figure.thumbnails img {
    float: left;
    width: calc(50% - 0.75em);
  }

  figure.thumbnails img:nth-child(even) {
    margin-left: 1.5em;
  }

  @supports (display: flex) {
    figure.thumbnails {
      display: flex;
      align-items: center;
    }

    figure.thumbnails img {
      flex-grow: 1;
      width: 0;
    }

    figure.thumbnails img + img {
      margin: 0 0 0 1.5em;
    }
  }
}


#login-modal {
  display: none;           /* 默认隐藏 */
  position: fixed;
  z-index: 999999;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;

  background: rgba(0,0,0,0.65);
  backdrop-filter: blur(5px);

  justify-content: center;
  align-items: center;
}

#login-modal.show {
  display: flex;           /* 点击后才变成 flex */
}

#login-modal .login-box {
  width: 350px;
  height: 450px;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 30px 80px rgba(0,0,0,0.35);
}

.login-header {
  height: 36px;
  background: #f7f8fa;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 18px;
  font-size: 14px;
  font-weight: 600;
  border-bottom: 1px solid #eee;
}

.login-close {
  cursor: pointer;
  font-size: 22px;
}

#login-modal iframe {
  flex: 1;
  width: 100%;
  border: none;
}


/* 用户信息弹窗样式 */
#user-info-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  z-index: 10000;
  display: flex;
  justify-content: center;
  align-items: center;
}

.user-modal-content {
  position: relative;
  width: 90%;
  max-width: 380px;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 40px rgba(0,0,0,0.3);
}

.modal-header {
  padding: 16px 20px;
  background: #f0f2f5;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: bold;
  font-size: 16px;
}

.modal-close {
  font-size: 24px;
  cursor: pointer;
  color: #666;
}

.modal-close:hover {
  color: #e63946;
}

.user-info-body {
  padding: 24px 20px;
  line-height: 1.6;
}

.user-info-item {
  margin-bottom: 16px;
}

.user-info-item label {
  display: inline-block;
  width: 90px;
  font-weight: bold;
  color: #555;
}

.user-info-item span {
  color: #333;
}

.modal-footer {
  padding: 16px 20px;
  text-align: center;
  border-top: 1px solid #eee;
}

.btn-logout {
  padding: 10px 32px;
  background: #e63946;
  color: white;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 15px;
}

.btn-logout:hover {
  background: #d32f2f;
}

/* 暗黑模式适配（可选） */
body.dark #user-info-modal .user-modal-content {
  background: #1e1e1e;
  color: #e0e0e0;
}

body.dark .modal-header {
  background: #2a2a2a;
}

body.dark .user-info-item label {
  color: #aaa;
}

body.dark .user-info-item span {
  color: #ddd;
}


/* 整体遮罩 */
#unlockTips-modal {
  display: none;  /* 默认隐藏 */
  position: fixed;
  z-index: 999999;   /* 保证在最顶部 */
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;

  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);

  justify-content: center;
  align-items: center;
}

/* 显示状态 */
#unlockTips-modal.show {
  display: flex;
}

/* 弹层主体 */
.unlockTips-box {
  width: 420px;
  background: #ffffff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.35);
  display: flex;
  flex-direction: column;
  animation: unlockFade 0.25s ease;
}

/* 头部 */
.unlockTips-header {
  height: 50px;
  background: #f6f7f9;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 600;
  border-bottom: 1px solid #eee;
}

/* 关闭按钮 */
.unlockTips-close {
  cursor: pointer;
  font-size: 22px;
  transition: 0.2s;
}

.unlockTips-close:hover {
  color: #ff4d4f;
}

/* 内容区 */
.unlockTips-content {
  padding: 28px 24px;
  font-size: 14px;
  line-height: 1.7;
  color: #444;
  text-align: center;
}

/* 底部按钮区域 */
.unlockTips-footer {
  padding: 16px;
  border-top: 1px solid #eee;
  text-align: center;
}

/* 按钮 */
.unlockTips-btn {
  background: #338ac5;
  color: #fff;
  border: none;
  padding: 8px 20px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  transition: 0.2s;
}

.unlockTips-btn:hover {
  background: #2c78ad;
}

/* 动画 */
@keyframes unlockFade {
  from {
    transform: translateY(-10px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}