/* 语言切换组件样式 */
.language-switch {
  position: fixed;
  top: 15px;
  right: 175px;
  z-index: 10000;
}

/* 在封面页的动画效果 */
.hero-cover ~ * .language-switch,
.landing-page .language-switch {
  animation: languageFadeIn 1.5s ease-out 2s backwards;
}

@keyframes languageFadeIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 语言按钮 */
.language-button {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: rgba(30, 35, 60, 0.8);
  border: 1px solid rgba(0, 170, 255, 0.3);
  border-radius: 25px;
  color: rgba(255, 255, 255, 0.9);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  backdrop-filter: blur(10px);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
  outline: none;
}

.language-button:hover {
  background: rgba(30, 35, 60, 0.95);
  border-color: rgba(0, 170, 255, 0.6);
  box-shadow: 0 6px 20px rgba(0, 170, 255, 0.3);
  transform: translateY(-2px);
}

.language-button:active {
  transform: translateY(0);
}

.language-icon {
  display: flex;
  align-items: center;
  font-size: 18px;
  color: #00aaff;
  transition: transform 0.3s ease;
}

.language-button:hover .language-icon {
  transform: rotate(180deg);
}

.language-text {
  letter-spacing: 0.5px;
  text-transform: uppercase;
  font-size: 13px;
}

/* 语言菜单 */
.language-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  background: rgba(30, 35, 60, 0.95);
  border: 1px solid rgba(0, 170, 255, 0.3);
  border-radius: 15px;
  overflow: hidden;
  backdrop-filter: blur(15px);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
  min-width: 140px;
  animation: menuSlideDown 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 10001;
}

@keyframes menuSlideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 语言选项 */
.language-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  cursor: pointer;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  transition: all 0.2s ease;
  position: relative;
}

.language-option:not(:last-child) {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.language-option:hover {
  background: rgba(0, 170, 255, 0.1);
  color: #ffffff;
}

.language-option.active {
  background: rgba(0, 170, 255, 0.15);
  color: #00aaff;
  font-weight: 600;
}

.option-flag {
  font-size: 18px;
  line-height: 1;
}

.option-text {
  flex: 1;
  letter-spacing: 0.3px;
}

.language-option i {
  font-size: 16px;
  color: #00aaff;
  margin-left: auto;
}

/* 遮罩层 */
.language-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  background: transparent;
}

/* 响应式设计 */
@media (max-width: 768px) {
  .language-switch {
    top: 20px;
    right: 20px;
  }

  .language-button {
    padding: 8px 14px;
    font-size: 12px;
  }

  .language-icon {
    font-size: 16px;
  }

  .language-text {
    font-size: 12px;
  }

  .language-menu {
    min-width: 120px;
  }

  .language-option {
    padding: 10px 14px;
    font-size: 13px;
  }

  .option-flag {
    font-size: 16px;
  }
}

@media (max-width: 480px) {
  .language-switch {
    top: 15px;
    right: 15px;
  }

  .language-button {
    padding: 7px 12px;
    gap: 6px;
  }

  .language-icon {
    font-size: 15px;
  }

  .language-text {
    font-size: 11px;
  }

  .language-menu {
    min-width: 110px;
  }

  .language-option {
    padding: 9px 12px;
    font-size: 12px;
    gap: 8px;
  }

  .option-flag {
    font-size: 15px;
  }

  .language-option i {
    font-size: 14px;
  }
}

/* Login-page light variant */
.access-gate .language-switch { top: 20px !important; right: 24px !important; }
.access-gate .language-button {
  min-height: 42px !important; padding: 0 15px !important; gap: 7px !important;
  color: #4f5965 !important; background: rgba(255, 255, 255, 0.9) !important;
  border: 1px solid #dce3ec !important; border-radius: 21px !important;
  box-shadow: 0 4px 16px rgba(37, 55, 84, 0.07) !important;
  backdrop-filter: blur(16px) saturate(150%) !important;
}
.access-gate .language-button:hover {
  color: var(--hm-blue) !important; background: #fff !important;
  border-color: #aac6ec !important; box-shadow: 0 8px 22px rgba(37, 55, 84, 0.11) !important;
  transform: translateY(-1px) !important;
}
.access-gate .language-button:active { transform: translateY(0) !important; }
.access-gate .language-icon { color: var(--hm-blue) !important; font-size: 18px !important; }
.access-gate .language-button:hover .language-icon { transform: rotate(16deg) !important; }
.access-gate .language-text {
  color: inherit !important; font-size: 12px !important;
  font-weight: 650 !important; letter-spacing: 0.045em !important;
}
.access-gate .language-menu {
  top: calc(100% + 8px) !important; min-width: 150px !important; padding: 6px !important;
  color: var(--hm-ink) !important; background: rgba(255, 255, 255, 0.98) !important;
  border: 1px solid #dce3ec !important; border-radius: 14px !important;
  box-shadow: 0 18px 42px rgba(37, 55, 84, 0.14) !important;
  backdrop-filter: blur(20px) saturate(150%) !important;
}
.access-gate .language-option {
  min-height: 42px !important; padding: 9px 11px !important;
  color: #4f5965 !important; border: 0 !important; border-radius: 9px !important;
}
.access-gate .language-option:not(:last-child) { border-bottom: 0 !important; }
.access-gate .language-option:hover { color: var(--hm-blue) !important; background: #f2f7ff !important; }
.access-gate .language-option.active {
  color: var(--hm-blue) !important; background: #eaf2ff !important; font-weight: 650 !important;
}
.access-gate .language-option i { color: var(--hm-blue) !important; }
.access-gate .option-flag {
  display: grid !important; place-items: center !important;
  width: 26px !important; height: 26px !important;
  background: #fff !important; border: 1px solid #e3e8ef !important;
  border-radius: 8px !important; font-size: 15px !important;
}

@media (max-width: 600px) {
  .access-gate .language-switch { top: 12px !important; right: 12px !important; }
  .access-gate .language-button {
    min-width: 40px !important; min-height: 40px !important;
    justify-content: center !important; padding: 0 11px !important;
  }
  .access-gate .language-text { display: none !important; }
}


/* 登录页面样式 */

/* 登录方式切换按钮 */
.login-method-toggle {
  display: flex;
  margin-bottom: 1.5rem;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  padding: 4px;
  width: 100%;
}

.login-method-toggle button {
  flex: 1;
  background: none;
  border: none;
  padding: 10px 15px;
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.7);
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.3s ease;
}

.login-method-toggle button.active {
  background: rgba(88, 101, 242, 0.7);
  color: white;
  box-shadow: 0 2px 10px rgba(88, 101, 242, 0.3);
}

.login-method-toggle button:hover:not(.active) {
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.9);
}

/* 表单组样式优化 */
.form-group {
  margin-bottom: 1.2rem;
}

.form-group label {
  display: block;
  margin-bottom: 6px;
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.8);
}

.form-input {
  width: 100%;
  padding: 12px 16px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  color: white;
  font-size: 1rem;
  transition: all 0.3s ease;
}

.form-input:focus {
  outline: none;
  border-color: rgba(88, 101, 242, 0.8);
  box-shadow: 0 0 0 2px rgba(88, 101, 242, 0.25);
}

.form-input:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* 输入框和按钮组合 */
.input-with-button {
  display: flex;
  gap: 10px;
}

.input-with-button .form-input {
  flex: 1;
}

.send-code-btn {
  background: rgba(88, 101, 242, 0.7);
  color: white;
  border: none;
  border-radius: 8px;
  padding: 0 15px;
  font-size: 0.85rem;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
}

.send-code-btn:hover:not(:disabled) {
  background: rgba(88, 101, 242, 0.9);
}

.send-code-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* 提交按钮 */
.key-submit {
  width: 100%;
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.9), rgba(101, 88, 245, 0.9));
  color: white;
  border: none;
  border-radius: 8px;
  padding: 14px;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  margin-top: 1rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(88, 101, 242, 0.3);
}

.key-submit:hover:not(:disabled) {
  background: linear-gradient(135deg, rgba(88, 101, 242, 1), rgba(101, 88, 245, 1));
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(88, 101, 242, 0.4);
}

.key-submit:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

.key-submit .arrow-icon {
  font-style: normal;
  transition: transform 0.3s ease;
}

.key-submit:hover:not(:disabled) .arrow-icon {
  transform: translateX(3px);
}

/* 页脚样式 */
.gate-footer {
  margin-top: 1.5rem;
  text-align: center;
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.7);
}

.toggle-auth-btn {
  background: none;
  border: none;
  color: rgba(88, 101, 242, 1);
  font-weight: 500;
  cursor: pointer;
  padding: 0 5px;
  transition: all 0.3s ease;
}

.toggle-auth-btn:hover {
  color: rgba(88, 101, 242, 0.8);
  text-decoration: underline;
}

/* 提示信息样式 */
.auth-success, 
.auth-error {
  margin-bottom: 1rem;
  padding: 10px;
  border-radius: 8px;
  text-align: center;
  font-size: 0.9rem;
}

.auth-success {
  background: rgba(46, 213, 115, 0.15);
  color: #2ed573;
  border: 1px solid rgba(46, 213, 115, 0.3);
}

.auth-error {
  background: rgba(255, 71, 87, 0.15);
  color: #ff4757;
  border: 1px solid rgba(255, 71, 87, 0.3);
}

.code-hint {
  margin-top: 6px;
  font-size: 0.8rem;
  color: rgba(88, 101, 242, 0.8);
}

/* 卡片样式增强 */
.gate-card {
  backdrop-filter: blur(10px);
}

.gate-card-inner {
  padding: 2rem;
  background: rgba(13, 17, 23, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
}

/* 特色标签容器 */
.feature-badges {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 1.5rem;
  flex-wrap: wrap;
  animation: fadeInUp 0.8s ease-out 0.3s both;
}

.feature-badge {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 1rem;
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.15), rgba(101, 88, 245, 0.15));
  border: 1px solid rgba(88, 101, 242, 0.3);
  border-radius: 20px;
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  transition: all 0.3s ease;
  cursor: default;
}

.feature-badge i {
  font-size: 1.1rem;
  color: rgba(88, 101, 242, 1);
  animation: pulse 2s ease-in-out infinite;
}

.feature-badge:hover {
  transform: translateY(-2px);
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.25), rgba(101, 88, 245, 0.25));
  border-color: rgba(88, 101, 242, 0.5);
  box-shadow: 0 4px 15px rgba(88, 101, 242, 0.3);
}

/* 标语文字增强 */
.gate-tagline {
  font-size: 1.1rem;
  background: linear-gradient(135deg, #a8b2ff, #c7d0ff, #a8b2ff);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: gradientShift 3s ease infinite;
  font-weight: 500;
  text-align: center;
  margin-top: 1rem;
  letter-spacing: 0.5px;
}

/* 渐变移动动画 */
@keyframes gradientShift {
  0%, 100% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}

/* 淡入上移动画 */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 脉冲动画 */
@keyframes pulse {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.1);
    opacity: 0.8;
  }
}

/* Logo容器装饰增强 */
.gate-logo-container {
  position: relative;
  margin-bottom: 2rem;
  text-align: center;
}

.gate-logo-container::before,
.gate-logo-container::after {
  content: '';
  position: absolute;
  width: 100px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(88, 101, 242, 0.5), transparent);
  top: 50%;
  animation: lineGlow 2s ease-in-out infinite;
}

.gate-logo-container::before {
  left: -120px;
}

.gate-logo-container::after {
  right: -120px;
}

@keyframes lineGlow {
  0%, 100% {
    opacity: 0.3;
  }
  50% {
    opacity: 1;
  }
}

/* 卡片入场动画 */
.gate-card {
  animation: cardSlideIn 0.6s ease-out;
}

@keyframes cardSlideIn {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 输入框聚焦时的光效 */
.form-input:focus {
  outline: none;
  border-color: rgba(88, 101, 242, 0.8);
  box-shadow: 0 0 0 2px rgba(88, 101, 242, 0.25), 0 0 15px rgba(88, 101, 242, 0.15);
}

/* 按钮波纹效果 */
.key-submit {
  position: relative;
  overflow: hidden;
}

.key-submit::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  transform: translate(-50%, -50%);
  transition: width 0.6s, height 0.6s;
}

.key-submit:active::before {
  width: 300px;
  height: 300px;
}

/* 悬浮装饰元素 */
.gate-container::before {
  content: '';
  position: absolute;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(88, 101, 242, 0.1), transparent);
  border-radius: 50%;
  top: -150px;
  right: -100px;
  pointer-events: none;
  animation: float 6s ease-in-out infinite;
}

.gate-container::after {
  content: '';
  position: absolute;
  width: 200px;
  height: 200px;
  background: radial-gradient(circle, rgba(101, 88, 245, 0.1), transparent);
  border-radius: 50%;
  bottom: -100px;
  left: -50px;
  pointer-events: none;
  animation: float 8s ease-in-out infinite reverse;
}

@keyframes float {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-20px) rotate(180deg);
  }
}

/* 响应式调整 */
@media (max-width: 768px) {
  .feature-badges {
    gap: 0.5rem;
  }
  
  .feature-badge {
    font-size: 0.75rem;
    padding: 0.4rem 0.8rem;
  }
  
  .gate-tagline {
    font-size: 0.95rem;
  }
  
  .gate-logo-container::before,
  .gate-logo-container::after {
    display: none;
  }
}

/* 适应浏览器界面大小的自适应与整体缩减样式 */

.access-gate {
  overflow: hidden !important;
}

.access-gate-container {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  height: 100vh !important;
  overflow-y: auto !important; /* 极端情况下仍能滚动 */
  padding: 1rem 0 !important;
  box-sizing: border-box !important;
  gap: 1.25rem !important; /* 原为 2rem，缩小间距 */
}

.access-gate-container .gate-container {
  max-width: 410px !important; /* 原为 460px，整体宽度缩小一点更紧凑 */
  padding: 0 15px !important; /* 缩减外部内边距 */
  margin: 0 auto !important;
}

/* 缩减 Logo 与标题部分 */
.access-gate .logo {
  font-size: 2.6rem !important; /* 原为 3.5rem，标题缩小 */
  letter-spacing: 4px !important;
  margin-bottom: 0.3rem !important;
}

.access-gate .logo-badge {
  font-size: 0.95rem !important; /* 徽标等比缩小 */
  right: -32px !important;
  top: -2px !important;
  padding: 0.1rem 0.4rem !important;
}

.access-gate .gate-tagline {
  font-size: 0.95rem !important; /* 原为 1.1rem */
  margin-top: 0.3rem !important;
  padding-bottom: 0.6rem !important; /* 缩减下边距 */
}

/* 缩减特色标签 */
.access-gate .feature-badges {
  margin-top: 0.8rem !important; /* 原为 1.5rem */
  gap: 0.6rem !important; /* 标签间距缩小 */
}

.access-gate .feature-badge {
  padding: 0.35rem 0.75rem !important; /* 标签变小 */
  font-size: 0.8rem !important; /* 原为 0.85rem */
}

/* 缩减登录面板卡片与内部组件 */
.access-gate .gate-card-inner {
  padding: 1.5rem 1.75rem !important; /* 原为 2.5rem 2rem，减少内边距 */
}

.access-gate .gate-header {
  margin-bottom: 1.2rem !important; /* 原为 2rem */
}

.access-gate .gate-header h2 {
  font-size: 1.5rem !important; /* 原为 1.8rem */
  margin-bottom: 0.25rem !important;
}

.access-gate .gate-header p {
  font-size: 0.85rem !important; /* 原为 0.95rem */
}

.access-gate .login-method-toggle {
  margin-bottom: 1.2rem !important; /* 原为 1.5rem */
}

.access-gate .login-method-toggle button {
  padding: 8px 12px !important; /* 原为 10px 15px */
  font-size: 0.85rem !important; /* 原为 0.9rem */
}

.access-gate .form-group {
  margin-bottom: 1rem !important; /* 原为 1.2rem */
}

.access-gate .form-group label {
  margin-bottom: 4px !important;
  font-size: 0.8rem !important;
}

.access-gate .form-input {
  padding: 10px 14px !important; /* 原为 12px 16px */
  font-size: 0.9rem !important; /* 原为 1rem */
}

.access-gate .key-submit {
  padding: 11px !important; /* 原为 14px */
  font-size: 0.95rem !important;
  margin-top: 0.8rem !important;
}

.access-gate .gate-footer {
  margin-top: 1.2rem !important; /* 原为 1.5rem */
  font-size: 0.8rem !important;
}

.access-gate .gate-footer p {
  margin-bottom: 0.25rem !important;
}

/* 针对视口高度较窄的浏览器窗口进行极致适配 */
@media (max-height: 850px) {
  .access-gate-container {
    gap: 0.8rem !important;
  }
  .access-gate .logo {
    font-size: 2.2rem !important;
  }
  .access-gate .gate-tagline {
    font-size: 0.85rem !important;
    padding-bottom: 0.4rem !important;
  }
  .access-gate .feature-badges {
    margin-top: 0.6rem !important;
  }
  .access-gate .gate-card-inner {
    padding: 1.25rem 1.5rem !important;
  }
  .access-gate .gate-header {
    margin-bottom: 1rem !important;
  }
}

@media (max-height: 720px) {
  .access-gate-container {
    gap: 0.4rem !important;
  }
  .access-gate .logo {
    font-size: 1.8rem !important;
    margin-bottom: 0.1rem !important;
  }
  .access-gate .gate-tagline {
    display: none !important; /* 隐藏标语，腾出垂直空间 */
  }
  .access-gate .feature-badges {
    display: none !important; /* 隐藏特色标签，腾出垂直空间 */
  }
  .access-gate .gate-card-inner {
    padding: 1rem 1.25rem !important;
  }
  .access-gate .gate-header {
    margin-bottom: 0.8rem !important;
  }
  .access-gate .form-group {
    margin-bottom: 0.6rem !important;
  }
  .access-gate .form-input {
    padding: 8px 12px !important;
  }
  .access-gate .login-method-toggle {
    margin-bottom: 0.8rem !important;
  }
  .access-gate .key-submit {
    padding: 9px !important;
    margin-top: 0.5rem !important;
  }
  .access-gate .gate-footer {
    margin-top: 0.8rem !important;
  }
}

/* Light authentication surface — aligned with the landing cover */
.access-gate {
  min-height: 100vh;
  color: var(--hm-ink) !important;
  background:
    radial-gradient(circle at 86% 2%, rgba(66, 133, 244, 0.13), transparent 30rem),
    radial-gradient(circle at 5% 88%, rgba(52, 168, 83, 0.08), transparent 28rem),
    #fff !important;
}
.access-gate::after {
  background: radial-gradient(circle at 50% 42%, rgba(26, 115, 232, 0.08), transparent 48%) !important;
  animation: none !important;
}
.access-gate .gate-container::before {
  width: 360px !important; height: 360px !important; top: -185px !important; right: -210px !important;
  background: radial-gradient(circle, rgba(66, 133, 244, 0.11), transparent 70%) !important;
  animation: none !important;
}
.access-gate .gate-container::after {
  width: 300px !important; height: 300px !important; bottom: -170px !important; left: -190px !important;
  background: radial-gradient(circle, rgba(52, 168, 83, 0.07), transparent 70%) !important;
  animation: none !important;
}
.access-gate .gate-logo-container::before,
.access-gate .gate-logo-container::after { display: none !important; }
.access-gate .gate-logo-container { margin-bottom: 18px !important; }
.access-gate .gate-logo { margin-bottom: 4px !important; padding: 0 !important; }
.access-gate .gate-logo .logo {
  color: var(--hm-blue) !important;
  background: linear-gradient(135deg, var(--hm-blue), var(--hm-indigo)) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important; text-shadow: none !important;
}
.access-gate .logo-glow,
.access-gate .logo-pulse,
.access-gate .logo-circuit { opacity: 0.18 !important; }
.access-gate .gate-tagline {
  margin-top: 2px !important; padding-bottom: 0 !important;
  color: #737b85 !important; background: none !important;
  -webkit-text-fill-color: currentColor !important; font-weight: 450 !important;
  letter-spacing: 0.03em !important; text-shadow: none !important; animation: none !important;
}
.access-gate .gate-card {
  overflow: hidden !important; color: var(--hm-ink) !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border: 1px solid var(--hm-line) !important; border-radius: 26px !important;
  box-shadow: 0 22px 56px rgba(37, 55, 84, 0.12), 0 2px 8px rgba(37, 55, 84, 0.04) !important;
  transform: none !important; backdrop-filter: blur(20px) saturate(140%);
  animation: cardSlideIn 0.48s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.access-gate .gate-card:hover {
  transform: none !important;
  box-shadow: 0 22px 56px rgba(37, 55, 84, 0.12), 0 2px 8px rgba(37, 55, 84, 0.04) !important;
}
.access-gate .gate-card::before {
  display: block !important; content: '' !important; position: absolute !important;
  inset: 0 0 auto !important; width: 100% !important; height: 3px !important; opacity: 1 !important;
  background: linear-gradient(90deg, var(--hm-blue), #58a6ff 52%, var(--hm-indigo)) !important;
}
.access-gate .gate-card::after { display: none !important; }
.access-gate .gate-card-inner {
  padding: 28px 30px 26px !important; color: var(--hm-ink) !important;
  background: transparent !important; border: 0 !important;
  border-radius: inherit !important; box-shadow: none !important;
}
.access-gate .gate-header { margin-bottom: 20px !important; }
.access-gate .gate-header h2 {
  margin-bottom: 6px !important; color: var(--hm-ink) !important;
  background: none !important; -webkit-text-fill-color: currentColor !important;
  font-size: 1.55rem !important; font-weight: 650 !important; letter-spacing: -0.025em !important;
}
.access-gate .gate-header p { color: #7a828c !important; font-size: 0.875rem !important; }
.access-gate .gate-form { margin-bottom: 18px !important; }
.access-gate .form-group label {
  margin-bottom: 7px !important; color: #4d5661 !important;
  font-size: 0.82rem !important; font-weight: 600 !important;
}
.access-gate .form-input {
  min-height: 46px !important; padding: 11px 14px !important;
  color: var(--hm-ink) !important; background: #f7f9fc !important;
  border: 1px solid #dce3ec !important; border-radius: 12px !important; box-shadow: none !important;
}
.access-gate .form-input::placeholder { color: #9aa1aa !important; }
.access-gate .form-input:focus {
  background: #fff !important; border-color: rgba(26, 115, 232, 0.62) !important;
  box-shadow: 0 0 0 4px rgba(26, 115, 232, 0.1) !important;
}
.access-gate .login-method-toggle {
  margin-bottom: 18px !important; padding: 4px; background: #f3f6fa !important;
  border: 1px solid #e1e6ee !important; border-radius: 12px !important;
}
.access-gate .login-method-toggle button {
  min-height: 38px !important; color: var(--hm-muted) !important;
  border-radius: 9px !important; font-weight: 550 !important;
}
.access-gate .login-method-toggle button.active {
  color: var(--hm-blue) !important; background: #fff !important; box-shadow: var(--hm-shadow-sm) !important;
}
.access-gate .login-method-toggle button:hover:not(.active) {
  color: #3f4955 !important; background: rgba(255, 255, 255, 0.66) !important;
}
.access-gate .key-submit,
.access-gate .send-code-btn {
  color: #fff !important; background: var(--hm-blue) !important;
  border: 1px solid var(--hm-blue) !important; border-radius: 12px !important;
  box-shadow: 0 8px 20px rgba(26, 115, 232, 0.18) !important;
}
.access-gate .key-submit {
  min-height: 48px !important; justify-content: center !important; gap: 10px !important;
  margin-top: 6px !important; font-weight: 650 !important;
}
.access-gate .send-code-btn { min-width: 94px; }
.access-gate .key-submit:hover,
.access-gate .send-code-btn:hover { background: var(--hm-blue-strong) !important; transform: translateY(-1px); }
.access-gate .key-submit .arrow-icon { color: rgba(255, 255, 255, 0.88) !important; }
.access-gate .gate-footer {
  margin-top: 14px !important; padding-top: 16px;
  color: #7a828c !important; border-top: 1px solid #edf0f4;
}
.access-gate .toggle-auth-btn,
.access-gate .code-hint { color: var(--hm-blue) !important; }
.access-gate .feature-badges { margin-top: 14px !important; }
.access-gate .feature-badge {
  color: #53606d !important; background: rgba(255, 255, 255, 0.72) !important;
  border: 1px solid #dfe6ef !important; box-shadow: 0 3px 12px rgba(37, 55, 84, 0.05) !important;
}
.access-gate .feature-badge i { color: var(--hm-blue) !important; animation: none !important; }
.access-gate .auth-success { color: #137333 !important; background: #eaf6ed !important; border-color: #b8dfc2 !important; }
.access-gate .auth-error { color: #b3261e !important; background: #fdf0ef !important; border-color: #f1c4c0 !important; }

@media (max-width: 600px) {
  .access-gate .gate-card-inner { padding: 24px 20px 22px !important; }
  .access-gate .gate-card { border-radius: 21px !important; }
}

/* 注册页面专用样式 */

/* 密码强度指示器 */
.password-strength {
  margin-top: 6px;
  height: 4px;
  border-radius: 2px;
  background: #2c2c2c;
  overflow: hidden;
}

.password-strength-bar {
  height: 100%;
  transition: width 0.3s ease, background-color 0.3s ease;
}

.strength-weak {
  width: 33%;
  background-color: #ff4757;
}

.strength-medium {
  width: 66%;
  background-color: #ffa502;
}

.strength-strong {
  width: 100%;
  background-color: #2ed573;
}

/* 密码匹配指示器 */
.password-match {
  font-size: 0.8rem;
  margin-top: 6px;
  transition: color 0.3s ease;
}

.password-match.match {
  color: #2ed573;
}

.password-match.no-match {
  color: #ff4757;
}

/* 注册页保持单一任务主线：账号信息 -> 验证码 -> 注册 */
.register-gate {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background:
    radial-gradient(circle at 50% -12%, rgba(26, 115, 232, 0.13), transparent 34rem),
    linear-gradient(180deg, #f7faff 0%, #ffffff 58%, #f8fbff 100%) !important;
}

.register-gate .access-gate-container {
  height: auto !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  justify-content: center !important;
  padding: clamp(20px, 4vh, 44px) 0 !important;
  gap: 0 !important;
}

.register-gate .gate-container {
  width: 100% !important;
  max-width: 440px !important;
}

.register-gate .gate-logo-container {
  margin-bottom: 14px !important;
}

.register-gate .gate-logo .logo {
  font-size: clamp(2rem, 7vw, 2.65rem) !important;
  letter-spacing: clamp(3px, 1vw, 5px) !important;
}

.register-gate .gate-tagline {
  margin-top: 0 !important;
  font-size: 0.88rem !important;
  color: #718096 !important;
}

.register-gate .gate-card {
  border-color: #dfe7f1 !important;
  border-radius: 22px !important;
  box-shadow: 0 18px 50px rgba(37, 69, 116, 0.11), 0 2px 8px rgba(37, 69, 116, 0.04) !important;
}

.register-gate .gate-card-inner {
  padding: 26px 30px 22px !important;
}

.register-gate .gate-header {
  margin-bottom: 18px !important;
  text-align: center;
}

.register-gate .gate-header h2 {
  margin-bottom: 5px !important;
  color: #172033 !important;
  font-size: 1.65rem !important;
  font-weight: 700 !important;
}

.register-gate .gate-header p {
  color: #7a8493 !important;
  font-size: 0.83rem !important;
}

.register-gate .gate-form {
  margin-bottom: 0 !important;
}

.register-gate .form-group {
  margin-bottom: 14px !important;
}

.register-gate .form-group label {
  margin-bottom: 6px !important;
  color: #445064 !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
}

.register-gate .form-input {
  min-height: 46px !important;
  padding: 10px 13px !important;
  color: #172033 !important;
  background: #f8faff !important;
  border-color: #dbe3ee !important;
  border-radius: 11px !important;
}

.register-gate .form-input:hover:not(:disabled) {
  border-color: #b9c8dc !important;
}

.register-gate .input-with-button {
  gap: 9px;
}

.register-gate .send-code-btn {
  min-width: 104px;
  padding: 0 14px;
  background: #eef5ff !important;
  color: #1769d2 !important;
  border-color: #cfe1fb !important;
  box-shadow: none !important;
  font-weight: 600;
}

.register-gate .send-code-btn:hover:not(:disabled) {
  color: #fff !important;
  background: #1769d2 !important;
  border-color: #1769d2 !important;
}

.register-gate .password-strength {
  height: 3px;
  margin-top: 6px;
  background: #e8edf4;
}

.register-gate .password-strength-text,
.register-gate .password-match,
.register-gate .code-hint {
  margin-top: 5px;
  font-size: 0.72rem;
}

.register-gate .key-submit {
  min-height: 48px !important;
  margin-top: 4px !important;
  background: #1a73e8 !important;
  box-shadow: 0 2px 8px rgba(26, 115, 232, 0.24) !important;
  border-color: #1769d2 !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 24px rgba(23, 105, 210, 0.22) !important;
  font-size: 0.98rem !important;
}

.register-gate .key-submit:hover:not(:disabled) {
  background: #1557b0 !important;
  box-shadow: 0 12px 28px rgba(23, 105, 210, 0.28) !important;
}

.register-gate .gate-footer {
  margin-top: 15px !important;
  padding-top: 14px !important;
  border-top-color: #edf1f6 !important;
  font-size: 0.82rem !important;
}

.register-gate .auth-success,
.register-gate .auth-error {
  margin-bottom: 13px;
  padding: 9px 11px;
  text-align: left;
  font-size: 0.78rem;
  line-height: 1.45;
}

@media (max-width: 600px) {
  .register-gate .access-gate-container {
    justify-content: flex-start !important;
    padding: 18px 0 22px !important;
  }

  .register-gate .gate-container {
    padding: 0 14px !important;
  }

  .register-gate .gate-logo-container {
    margin-bottom: 12px !important;
  }

  .register-gate .gate-logo .logo {
    font-size: 2rem !important;
  }

  .register-gate .gate-card {
    border-radius: 18px !important;
  }

  .register-gate .gate-card-inner {
    padding: 22px 18px 18px !important;
  }

  .register-gate .gate-header {
    margin-bottom: 16px !important;
  }

  .register-gate .gate-header h2 {
    font-size: 1.45rem !important;
  }

  .register-gate .form-group {
    margin-bottom: 12px !important;
  }

  .register-gate .form-input {
    min-height: 44px !important;
  }

  .register-gate .send-code-btn {
    min-width: 96px;
    padding: 0 11px;
    font-size: 0.78rem;
  }
}

@media (max-width: 370px) {
  .register-gate .input-with-button {
    flex-direction: column;
  }

  .register-gate .send-code-btn {
    min-height: 42px;
  }
}

/* InputArea组件样式 - Minimal Sci-Fi Capsule Update */
.input-container {
  width: 100%;
  max-width: 860px; /* 稍微放宽一点 */
  margin: 2rem auto 1.5rem auto; /* 居中显示 */
  position: relative;
  z-index: 1000; /* 提升层级，防止花瓣菜单被遮挡 */
  overflow: visible !important;
}

/* 移除旧的 input-header 样式 */
.input-header,
.input-title {
  display: none;
}

.input-area-form {
  width: 100%;
}

/* 胶囊输入栏容器 */
.input-capsule-bar {
  display: flex;
  align-items: flex-end; /* 底部对齐，适应输入框高度变化 */
  /* 配色与模式卡片一致，稍微亮一点 */
  background: var(--input-bg);
  backdrop-filter: blur(12px);
  border: 1px solid var(--input-border); /* 边框色调也调整为蓝色系 */
  border-radius: 40px;
  padding: 16px 20px; /* 增加内边距，使输入框看起来更高大 */

  gap: 16px; /* 增加间距 */
  box-shadow: 
    0 6px 18px rgba(0, 0, 0, 0.08),
    inset 0 1px 1px rgba(255, 255, 255, 0.05);
  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  width: 100%;
  position: relative;
  z-index: 100; /* 确保在花瓣菜单之上，且高于其他页面元素 */
  overflow: visible !important; /* 强制允许子元素溢出 */
}

.input-capsule-bar:hover {
  border-color: rgba(26, 115, 232, 0.35);
  box-shadow: 
    0 8px 24px rgba(0, 0, 0, 0.06),
    0 0 15px var(--accent-glow);
  transform: translateY(-1px);
}

.input-capsule-bar:focus-within {
  background: var(--input-focus-bg);
  border-color: var(--accent-color);
  animation: capsule-focus-breath 4s infinite ease-in-out;
}

@keyframes capsule-focus-breath {
  0%, 100% {
    box-shadow: 
      0 0 0 1px var(--accent-color),
      0 4px 16px rgba(26, 115, 232, 0.12);
    transform: translateY(-1px);
  }
  50% {
    box-shadow: 
      0 0 0 1px var(--accent-color),
      0 12px 32px rgba(26, 115, 232, 0.22);
    transform: translateY(-2.5px);
  }
}

/* 通用胶囊图标按钮样式 */
.capsule-icon-btn {
  width: 44px; /* 稍微加宽 */
  height: 56px; /* 高度匹配单行输入框 */
  flex-shrink: 0;
  border: none;
  background: transparent;
  color: var(--input-btn-color); /* 稍微提亮默认颜色 */
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 24px; /* 图标加大 */
  padding: 0;
  position: relative;
}

.capsule-icon-btn:hover {
  color: var(--accent-color);
  transform: scale(1.1) translateY(-1.5px);
}

.capsule-icon-btn.has-file {
  color: var(--accent-color);
}

/* 上传指示点 */
.upload-indicator {
  position: absolute;
  top: 10px;
  right: 6px;
  width: 6px;
  height: 6px;
  background-color: var(--accent-color);
  border-radius: 50%;
  box-shadow: 0 0 5px var(--accent-color);
}

/* 已上传图片数量徽标 */
.upload-count-badge {
  position: absolute;
  top: 8px;
  right: 4px;
  min-width: 16px;
  height: 16px;
  background-color: var(--accent-color);
  color: #fff;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  padding: 0 3px;
  box-shadow: 0 0 5px var(--accent-color);
}

/* 输入框样式 */
.input-capsule-textarea {
  flex: 1;
  background: transparent;
  border: none;
  color: var(--text-color);
  font-size: 1.15rem; /* 字体稍微加大，更易阅读 */
  font-family: 'Inter', sans-serif;
  resize: none;
  line-height: 1.6; /* 行高增加 */
  padding: 14px 10px; /* 增加内边距 */
  min-height: 56px; /* 增加最小高度 */
  max-height: 200px;
  overflow-y: auto;
}

/* 输入框滚动条样式优化 */
.input-capsule-textarea::-webkit-scrollbar {
  width: 6px;
}
.input-capsule-textarea::-webkit-scrollbar-track {
  background: transparent;
}
.input-capsule-textarea::-webkit-scrollbar-thumb {
  background-color: var(--hover-color);
  border-radius: 10px;
}
.input-capsule-textarea::-webkit-scrollbar-thumb:hover {
  background-color: var(--light-gray);
}

.input-capsule-textarea:focus {
  outline: none;
}

.input-capsule-textarea::placeholder {
  color: var(--input-placeholder-color);
}

/* 提示词历史与收藏 */
.prompt-history-panel {
  width: 100%;
  margin-top: 10px;
  padding: 0 14px;
}

.prompt-history-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 7px;
  color: var(--input-placeholder-color);
  font-size: 12px;
}

.prompt-history-title {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--text-color);
  font-weight: 600;
}

.prompt-history-title i {
  color: var(--accent-color);
  font-size: 14px;
}

.prompt-history-list {
  display: flex;
  gap: 8px;
  width: 100%;
  padding: 1px 1px 7px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--input-border) transparent;
}

.prompt-history-list::-webkit-scrollbar {
  height: 4px;
}

.prompt-history-list::-webkit-scrollbar-thumb {
  background: var(--input-border);
  border-radius: 4px;
}

.prompt-history-item {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  max-width: 360px;
  min-height: 34px;
  overflow: hidden;
  background: var(--input-bg);
  border: 1px solid var(--input-border);
  border-radius: 18px;
  transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.prompt-history-item:hover {
  border-color: var(--accent-color);
  transform: translateY(-1px);
}

.prompt-history-item.is-favorite {
  border-color: rgba(245, 158, 11, 0.5);
}

.prompt-history-text,
.prompt-favorite-btn {
  border: 0;
  background: transparent;
  color: var(--text-color);
  cursor: pointer;
  font: inherit;
}

.prompt-history-text {
  max-width: 310px;
  padding: 7px 5px 7px 13px;
  overflow: hidden;
  font-size: 13px;
  line-height: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.prompt-favorite-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  width: 35px;
  flex: 0 0 35px;
  padding: 0;
  color: var(--input-placeholder-color);
  font-size: 16px;
  transition: color 0.2s ease, transform 0.2s ease;
}

.prompt-favorite-btn:hover,
.prompt-history-item.is-favorite .prompt-favorite-btn {
  color: #f59e0b;
}

.prompt-favorite-btn:hover {
  transform: scale(1.12);
}

.prompt-history-text:focus-visible,
.prompt-favorite-btn:focus-visible {
  outline: 2px solid var(--accent-color);
  outline-offset: -2px;
}

.prompt-history-panel.is-disabled {
  opacity: 0.55;
}

.prompt-history-text:disabled,
.prompt-favorite-btn:disabled {
  cursor: not-allowed;
}

/* AI修饰小按钮 */
.ai-enhance-icon-btn {
  color: #a5b4fc;
  font-size: 20px;
  margin-right: 6px;
}

.ai-enhance-icon-btn:hover {
  color: #818cf8;
  transform: scale(1.1) rotate(15deg);
  text-shadow: 0 0 10px #818cf8;
}

/* 提交按钮容器 */
.submit-btn-wrapper {
  position: relative;
  width: 56px;
  height: 56px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 20; /* 确保在最上层 */
  overflow: visible !important; /* 强制允许溢出 */
}

/* 提交按钮 */
.capsule-submit-btn {
  width: 56px;
  height: 56px;
  border-radius: 28px;
  border: none;
  background: linear-gradient(135deg, var(--accent-color) 0%, #3a56d4 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  box-shadow: 0 4px 10px rgba(79, 109, 245, 0.3);
  overflow: hidden;
  position: relative;
  z-index: 22; /* 比wrapper高，确保可点击 */
}

.capsule-submit-btn:hover:not(:disabled) {
  transform: scale(1.05);
  box-shadow: 0 6px 15px rgba(79, 109, 245, 0.5);
}

.capsule-submit-btn:active:not(:disabled) {
  transform: scale(0.95);
}

.capsule-submit-btn:disabled {
  cursor: not-allowed;
  background: var(--submit-disabled-bg);
  border: 1px solid var(--submit-disabled-border);
  box-shadow: none;
}

.capsule-submit-btn:disabled .current-mode-icon {
  color: var(--submit-disabled-color);
}

.capsule-submit-btn i.rotating {
  color: white;
  font-size: 20px;
  animation: rotate 1s linear infinite;
}

.current-mode-icon {
  color: white;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 桌面端/移动端图标切换 */
.submit-icon-mobile {
  display: none;
}
.submit-icon-desktop {
  display: block;
}

.upload-icon-mobile {
  display: none;
}

/* 移动端模式切换按钮 (默认隐藏) */
.mobile-mode-toggle {
  display: none;
}

@keyframes rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* 花瓣菜单 */
.mode-petal-menu {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 200px; /* 增加感应区域，防止鼠标移开时立即消失 */
  height: 200px;
  transform: translate(-50%, -50%);
  pointer-events: none; /* 默认不响应事件 */
  z-index: 15; /* 在按钮之下，但在其他元素之上 */
  border-radius: 50%;
}

.mode-petal-menu.visible {
  pointer-events: auto;
}

.mode-petal-item {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 48px; /* 加大圆盘尺寸 */
  height: 48px;
  border-radius: 50%;
  background: var(--petal-bg); /* 增加不透明度 */
  backdrop-filter: blur(12px);
  border: 1px solid var(--petal-border);
  color: var(--petal-color);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transform: translate(-50%, -50%) scale(0);
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  opacity: 0;
  box-shadow: var(--petal-shadow);
  z-index: 16;
  font-size: 20px; /* 加大图标 */
}

.mode-petal-menu.visible .mode-petal-item {
  opacity: 1;
  /* 确保展开后位置正确，并保持缩放 */
  transform: translate(calc(-50% + var(--tx)), calc(-50% + var(--ty))) scale(1);
  transition-delay: var(--delay);
}

.mode-petal-item:hover {
  background: rgba(0, 170, 255, 0.9);
  color: white;
  border-color: rgba(0, 170, 255, 1);
  box-shadow: 0 0 20px rgba(0, 170, 255, 0.6);
  /* 悬停时放大 */
  transform: translate(calc(-50% + var(--tx)), calc(-50% + var(--ty))) scale(1.2);
  z-index: 25; /* 悬停时置顶 */
}

.mode-petal-item.active {
  background: var(--petal-active-bg);
  border-color: var(--petal-active-border);
  color: var(--petal-active-color);
  box-shadow: var(--petal-active-shadow);
}

.mode-name {
  display: none; /* Desktop hidden */
}

/* 多图预览水平行 */
.image-previews-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin: 0 0 0.8rem 1rem;
}

/* 图片预览区域优化 */
.image-preview-container {
  max-width: 130px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(0, 0, 0, 0.3);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
  position: relative;
  backdrop-filter: blur(5px);
  animation: slideDown 0.3s ease-out;
  display: inline-block;
}

@keyframes slideDown {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

.image-preview {
  width: 100%;
  height: auto;
  display: block;
  max-height: 120px;
  object-fit: contain;
}

.remove-image-btn {
  position: absolute;
  top: 4px;
  right: 4px;
  background-color: rgba(0, 0, 0, 0.6);
  color: white;
  border: none;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  backdrop-filter: blur(4px);
  font-size: 12px;
}

.remove-image-btn:hover {
  background-color: rgba(239, 68, 68, 0.8);
  transform: rotate(90deg);
}

/* 进度条 */
.progress-bar {
  width: 100%;
  height: 2px;
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 2px;
  margin-top: 0.5rem;
  overflow: hidden;
  position: relative;
}

.progress-fill {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background: linear-gradient(90deg, var(--accent-color), #a5b4fc, var(--accent-color));
  background-size: 200% 100%;
  border-radius: 2px;
  animation: loading-progress 1.5s infinite linear;
  width: 30%;
  box-shadow: 0 0 10px var(--accent-color);
}

/* 提示词推荐区域 */
.input-bottom-area {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
  padding: 0 6px;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

.suggestions-wrapper {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  flex: 1;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 4px;
  /* 隐藏滚动条但保留滚动功能 */
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.suggestions-wrapper::-webkit-scrollbar {
  display: none;
}

.suggestion-card {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 16px;
  padding: 3px 9px;
  font-size: 0.72rem;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.6);
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.25, 0.8, 0.25, 1);
  backdrop-filter: blur(5px);
  user-select: none;
  display: block;
  animation: fadeIn 0.5s ease-out;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 0;
  max-width: clamp(140px, 30vw, 340px);
}

.suggestion-card:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(165, 180, 252, 0.4);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.suggestion-card:active {
  transform: translateY(0);
  background: rgba(255, 255, 255, 0.08);
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

/* 移动端响应式优化 */
@media (max-width: 768px) {
  .input-container {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 8px 12px calc(14px + env(safe-area-inset-bottom)) 12px !important; /* 向下偏移 6px (原8px)，贴紧手机底边缘，进一步避开对画板的遮挡 */
    background: linear-gradient(to top, rgba(15, 17, 28, 0.98) 85%, rgba(15, 17, 28, 0.8) 95%, rgba(15, 17, 28, 0));
    backdrop-filter: blur(16px);
    box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.6);
    z-index: 1001; /* 确保在最上层 */
  }

  /* 移动端模式切换药丸栏 (模仿 Gemini) */
  .mobile-mode-pills-container {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding: 2px 2px 6px 2px;
    margin-bottom: 4px;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE 10+ */
    width: 100%;
  }
  
  .mobile-mode-pills-container::-webkit-scrollbar {
    display: none; /* Safari and Chrome */
  }
  
  .mobile-mode-pill {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 14px;
    color: rgba(255, 255, 255, 0.7);
    font-size: 11px;
    font-weight: 500;
    white-space: nowrap;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    flex-shrink: 0;
  }
  
  .mobile-mode-pill i {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.6);
  }
  
  .mobile-mode-pill.active {
    background: linear-gradient(135deg, rgba(0, 170, 255, 0.2), rgba(0, 122, 255, 0.3));
    border-color: rgba(0, 170, 255, 0.8);
    color: #00aaff;
    box-shadow: 0 0 10px rgba(0, 170, 255, 0.25);
    font-weight: 600;
  }

  .mobile-mode-pill.active i {
    color: #00aaff;
  }

  .input-capsule-bar {
    padding: 4px 6px 4px 10px;
    gap: 6px;
    border-radius: 20px;
  }
  
  .mode-icon-hint {
    font-size: 15px;
  }
  
  .capsule-icon-btn {
    width: 30px;
    height: 36px;
    font-size: 17px;
  }
  
  .input-capsule-textarea {
    font-size: 13.5px;
    padding: 8px 2px;
    min-height: 36px;
  }
  
  .capsule-submit-btn {
    width: 36px;
    height: 36px;
    display: flex; /* 保持显示 */
  }
  
  /* 移动端隐藏独立模式切换按钮 */
  .mobile-mode-toggle {
    display: none !important;
  }

  .submit-btn-wrapper {
    width: auto;
    height: 36px;
    gap: 6px;
    position: relative;
    display: flex;
    align-items: center;
    overflow: visible !important;
  }

  .capsule-submit-btn {
    width: 36px;
    height: 36px;
    display: flex; /* 保持显示 */
  }
  
  .submit-icon-desktop {
    display: none;
  }
  
  .submit-icon-mobile {
    display: block;
    font-size: 16px;
  }

  /* 提示词横向排列 (保持和桌面一致，允许横向滑动) */
  .suggestions-wrapper {
    flex-direction: row;
    width: 100%;
    gap: 4px;
    overflow-x: auto;
  }
  
  .suggestion-card {
    width: auto;
    max-width: 78vw;
    font-size: 10.5px;
    padding: 3px 8px;
    text-align: center;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.08);
  }
  
  .input-bottom-area {
    flex-direction: column;
    gap: 6px;
    margin-top: 6px;
  }
  
  .extra-content-wrapper {
    margin-left: 0 !important;
    width: 100%;
    justify-content: flex-end;
  }
}

/* --- 模式切换交互提醒动效 (无文字纯视觉) --- */
/* 桌面端外层光晕动效 */
.submit-btn-wrapper.show-reminder::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 28px; /* 匹配按钮圆角 */
  box-shadow: 0 0 0 0 rgba(0, 170, 255, 0.6);
  animation: wrapper-pulse 2s infinite;
  pointer-events: none;
  z-index: 10;
}

/* 给按钮里的图标加一个轻微的跳动效果，进一步吸引视线 */
.submit-btn-wrapper.show-reminder .submit-icon-desktop,
.mobile-mode-toggle.show-reminder i {
  animation: icon-bounce 2s infinite;
  display: inline-block;
}

@keyframes wrapper-pulse {
  0% { box-shadow: 0 0 0 0 rgba(0, 170, 255, 0.6); }
  70% { box-shadow: 0 0 0 15px rgba(0, 170, 255, 0); }
  100% { box-shadow: 0 0 0 0 rgba(0, 170, 255, 0); }
}

@keyframes icon-bounce {
  0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
  40% { transform: translateY(-4px); }
  60% { transform: translateY(-2px); }
}

@media (max-width: 768px) {
  /* 移动端不给 wrapper 施加光晕，只给独立的 toggle 按钮施加光晕 */
  .submit-btn-wrapper.show-reminder::before {
    display: none; 
  }
  
  .mobile-mode-toggle.show-reminder {
    animation: wrapper-pulse 2s infinite;
  }
}

/* ========================================================
   LIGHT THEME STYLES - INPUT AREA & BUTTONS (Gemini-inspired)
   ======================================================== */
html[data-theme='light'] .image-preview-container {
  border: 1px solid var(--border-color) !important;
  background: rgba(0, 0, 0, 0.03) !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important;
}

html[data-theme='light'] .remove-image-btn {
  background-color: rgba(255, 255, 255, 0.85) !important;
  color: var(--text-color) !important;
}

html[data-theme='light'] .remove-image-btn:hover {
  background-color: var(--error-color) !important;
  color: white !important;
}

html[data-theme='light'] .suggestion-card {
  background: #f0f4f9 !important;
  border: 1px solid #dadce0 !important;
  color: #5f6368 !important;
}

html[data-theme='light'] .suggestion-card:hover {
  background: #e8f0fe !important;
  border-color: var(--accent-color) !important;
  color: var(--accent-color) !important;
  box-shadow: 0 4px 12px rgba(26, 115, 232, 0.1) !important;
}

html[data-theme='light'] .suggestion-card:active {
  background: #d2e3fc !important;
}

html[data-theme='light'] .mobile-mode-pill {
  background: #f0f4f9 !important;
  border: 1px solid #dadce0 !important;
  color: #5f6368 !important;
}

html[data-theme='light'] .mobile-mode-pill i {
  color: #5f6368 !important;
}

html[data-theme='light'] .mobile-mode-pill.active {
  background: #e8f0fe !important;
  border-color: var(--accent-color) !important;
  color: var(--accent-color) !important;
  box-shadow: 0 0 10px var(--accent-glow) !important;
}

html[data-theme='light'] .mobile-mode-pill.active i {
  color: var(--accent-color) !important;
}

/* 亮色模式下激活态生成按钮适配 - 采用优雅柔和的 Gemini 渐变彩色，告别突兀的纯高饱和蓝色 */
html[data-theme='light'] .capsule-submit-btn:not(:disabled) {
  background: linear-gradient(135deg, #4285f4 0%, #9b72cb 50%, #d96570 100%) !important;
  box-shadow: 0 4px 15px rgba(155, 114, 203, 0.25) !important;
}

html[data-theme='light'] .capsule-submit-btn:not(:disabled):hover {
  background: linear-gradient(135deg, #5191f5 0%, #a87fd6 50%, #e07489 100%) !important;
  box-shadow: 0 6px 20px rgba(155, 114, 203, 0.4) !important;
  transform: scale(1.05);
}

html[data-theme='light'] .capsule-submit-btn:not(:disabled):active {
  transform: scale(0.95);
}

/* ==========================================================================
   模式解释说明面板样式 - 现代暗色微弱磨砂 & 亮色优雅适配
   ========================================================================== */
.mode-explanation-panel {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 10px 14px;
  padding: 5px 10px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.05);
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  width: fit-content;
  max-width: 100%;
  animation: explanation-fade-in 0.35s cubic-bezier(0.25, 0.8, 0.25, 1);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

/* 亮色模式适配 */
html[data-theme='light'] .mode-explanation-panel {
  background: rgba(0, 0, 0, 0.02);
  border: 1px solid rgba(0, 0, 0, 0.04);
  color: rgba(0, 0, 0, 0.6);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02);
}

@keyframes explanation-fade-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.mode-explanation-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-weight: 600;
  color: var(--accent-color, #1a73e8);
  background: rgba(26, 115, 232, 0.1);
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 12px;
  white-space: nowrap;
}

/* 亮色模式下的标签稍微提亮 */
html[data-theme='light'] .mode-explanation-tag {
  background: rgba(26, 115, 232, 0.08);
}

.mode-explanation-tag i {
  font-size: 14px;
}

/* ==========================================================================
   积分消耗胶囊组件（分段选择：免费 / 标准积分 / 深度思考）
   ========================================================================== */

.usage-mode-capsule {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 2px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  box-sizing: border-box;
  gap: 2px;
  user-select: none;
  isolation: isolate;
  transition: border-color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease;
}

.usage-mode-capsule:hover {
  border-color: rgba(255, 255, 255, 0.24);
}

.usage-mode-segment {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 25px;
  padding: 3px 10px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: rgba(255, 255, 255, 0.65);
  font: inherit;
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  box-sizing: border-box;
  outline: none;
  transition: all 0.22s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.usage-mode-segment i {
  font-size: 12px;
  transition: transform 0.2s ease, color 0.2s ease;
}

.usage-mode-segment:hover:not(.active) {
  color: rgba(255, 255, 255, 0.92);
  background: rgba(255, 255, 255, 0.07);
}

.usage-mode-segment:hover:not(.active) i {
  transform: scale(1.12);
}

/* 激活通用样式 */
.usage-mode-segment.active {
  font-weight: 600;
  cursor: default;
}

/* 激活：免费模式（清新蓝绿色调） */
.usage-mode-segment.active.free-active {
  background: rgba(56, 189, 248, 0.15);
  color: #38bdf8;
  border-color: rgba(56, 189, 248, 0.35);
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
}

.usage-mode-segment.active.free-active i {
  color: #38bdf8;
}

/* 激活：标准积分模式（经典科技深蓝渐变） */
.usage-mode-segment.active.standard-active {
  background: linear-gradient(100deg, #1d4ed8, #2563eb 52%, #0ea5e9);
  color: #ffffff;
  border-color: rgba(96, 165, 250, 0.4);
  box-shadow: 0 0 12px rgba(37, 99, 235, 0.35);
}

.usage-mode-segment.active.standard-active i {
  color: #ffffff;
}

/* 激活：深度思考模式（位于胶囊最右端，优雅深邃紫蓝渐变与AI智思律动） */
.usage-mode-segment.active.deep-active {
  background: linear-gradient(105deg, #4f46e5 0%, #7c3aed 50%, #9333ea 100%);
  color: #ffffff;
  border-color: rgba(192, 132, 252, 0.45);
  box-shadow: 0 0 14px rgba(124, 58, 237, 0.45), inset 0 0 8px rgba(255, 255, 255, 0.2);
}

.usage-mode-segment.active.deep-active i {
  color: #f5f3ff;
  animation: brain-pulse 2.2s infinite ease-in-out;
}

@keyframes brain-pulse {
  0%, 100% {
    transform: scale(1);
    filter: drop-shadow(0 0 0 transparent);
  }
  50% {
    transform: scale(1.18);
    filter: drop-shadow(0 0 5px rgba(233, 213, 255, 0.85));
  }
}

/* 深度思考批注标签 */
.usage-mode-segment .deep-think-tag {
  display: inline-flex;
  align-items: center;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(147, 51, 234, 0.22);
  border: 1px solid rgba(192, 132, 252, 0.3);
  color: #e9d5ff;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0.02em;
  transition: all 0.2s ease;
}

.usage-mode-segment.active.deep-active .deep-think-tag {
  background: rgba(255, 255, 255, 0.22);
  border-color: rgba(255, 255, 255, 0.45);
  color: #ffffff;
}

/* 等待时间更长提示文本 */
.usage-mode-segment .deep-think-wait-hint {
  font-size: 10px;
  color: rgba(255, 255, 255, 0.52);
  font-weight: 400;
  letter-spacing: -0.01em;
  margin-left: -1px;
  transition: color 0.2s ease;
}

.usage-mode-segment.active.deep-active .deep-think-wait-hint {
  color: rgba(255, 255, 255, 0.88);
}

/* 提交按钮深度思考高亮光效 */
.capsule-submit-btn.deep-thinking-submit {
  background: linear-gradient(135deg, #4f46e5, #7c3aed 55%, #9333ea);
  box-shadow: 0 0 14px rgba(124, 58, 237, 0.45);
}

.capsule-submit-btn.deep-thinking-submit:hover:not(:disabled) {
  box-shadow: 0 0 20px rgba(124, 58, 237, 0.68);
  transform: scale(1.03);
}

/* 亮色模式适配 (Light Theme) */
html[data-theme='light'] .usage-mode-capsule {
  background: rgba(148, 163, 184, 0.12);
  border-color: rgba(71, 85, 105, 0.18);
}

html[data-theme='light'] .usage-mode-capsule:hover {
  border-color: rgba(71, 85, 105, 0.32);
}

html[data-theme='light'] .usage-mode-segment {
  color: #64748b;
}

html[data-theme='light'] .usage-mode-segment:hover:not(.active) {
  color: #0f172a;
  background: rgba(0, 0, 0, 0.05);
}

html[data-theme='light'] .usage-mode-segment.active.free-active {
  background: rgba(2, 132, 199, 0.12);
  color: #0284c7;
  border-color: rgba(2, 132, 199, 0.35);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

html[data-theme='light'] .usage-mode-segment.active.standard-active {
  background: linear-gradient(100deg, #2563eb, #3b82f6 52%, #0284c7);
  color: #ffffff;
  border-color: rgba(37, 99, 235, 0.45);
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.28);
}

html[data-theme='light'] .usage-mode-segment.active.deep-active {
  background: linear-gradient(100deg, #6b21a8, #7c3aed 48%, #4f46e5);
  color: #ffffff;
  border-color: rgba(124, 58, 237, 0.45);
  box-shadow: 0 2px 10px rgba(124, 58, 237, 0.32);
}

html[data-theme='light'] .usage-mode-segment .deep-think-tag {
  background: rgba(124, 58, 237, 0.1);
  border-color: rgba(124, 58, 237, 0.25);
  color: #6d28d9;
}

html[data-theme='light'] .usage-mode-segment.active.deep-active .deep-think-tag {
  background: rgba(255, 255, 255, 0.25);
  border-color: rgba(255, 255, 255, 0.45);
  color: #ffffff;
}

html[data-theme='light'] .usage-mode-segment .deep-think-wait-hint {
  color: #94a3b8;
}

html[data-theme='light'] .usage-mode-segment.active.deep-active .deep-think-wait-hint {
  color: rgba(255, 255, 255, 0.9);
}

html[data-theme='light'] .capsule-submit-btn.deep-thinking-submit {
  background: linear-gradient(135deg, #6d28d9, #7c3aed 55%, #4f46e5);
  box-shadow: 0 2px 12px rgba(109, 40, 217, 0.35);
}

.mode-explanation-divider {
  width: 1px;
  height: 10px;
  background-color: rgba(255, 255, 255, 0.15);
  margin: 0 2px;
}

html[data-theme='light'] .mode-explanation-divider {
  background-color: rgba(0, 0, 0, 0.1);
}

.mode-explanation-desc {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex: 0 1 auto;
  min-width: 0;
  line-height: 1.4;
}

.mode-explanation-desc i {
  font-size: 14px;
  color: var(--accent-color, #1a73e8);
  opacity: 0.8;
}

.mode-explanation-desc-title {
  font-weight: 600;
  color: rgba(255, 255, 255, 0.75);
  white-space: nowrap;
  margin-right: 4px;
}

html[data-theme='light'] .mode-explanation-desc-title {
  color: rgba(0, 0, 0, 0.75);
}

.mode-explanation-desc-text {
  color: rgba(255, 255, 255, 0.55);
}

html[data-theme='light'] .mode-explanation-desc-text {
  color: rgba(0, 0, 0, 0.55);
}

/* 移动端适配 */
@media (max-width: 768px) {
  .mode-explanation-panel {
    padding: 4px 8px;
    font-size: 11px;
    border-radius: 14px;
    gap: 5px;
    margin: 0 4px 8px;
    width: fit-content;
    box-sizing: border-box;
  }

  .mode-explanation-tag {
    font-size: 11px;
    padding: 2px 8px;
  }

  .usage-mode-capsule {
    padding: 1px;
    gap: 1px;
    max-width: 100%;
  }

  .usage-mode-segment {
    min-height: 22px;
    padding: 2px 7px;
    font-size: 10px;
    gap: 3px;
  }

  .usage-mode-segment i {
    font-size: 11px;
  }

  .usage-mode-segment .deep-think-tag {
    font-size: 9px;
    padding: 0 4px;
  }

  .usage-mode-segment .deep-think-wait-hint {
    font-size: 9px;
  }

  @media (max-width: 480px) {
    .usage-mode-segment .deep-think-wait-hint {
      display: none;
    }
  }

  .usage-mode-switch {
    width: 110px;
    min-height: 24px;
    padding-right: 26px;
    padding-left: 26px;
  }

  .usage-mode-label {
    font-size: 11px;
  }

  .usage-mode-knob {
    top: 3px;
    width: 16px;
    height: 16px;
    font-size: 9px;
  }

  .usage-mode-switch.paid-active .usage-mode-knob {
    left: calc(100% - 19px);
  }

  .mode-explanation-divider {
    display: none; /* 移动端用自然折行排列 */
  }

  .mode-explanation-desc {
    min-width: 100%;
    margin-top: 2px;
    align-items: flex-start;
  }
}

/* Gemini-inspired mobile composer */
@media (max-width: 768px) {
  .input-container {
    position: fixed !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 22px 16px calc(12px + env(safe-area-inset-bottom)) !important;
    overflow: visible !important;
    background: linear-gradient(to top, var(--primary-color, #212121) 58%, transparent) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    z-index: 1001 !important;
  }

  .input-area-form {
    width: 100%;
    max-width: 680px;
    margin: 0 auto;
  }

  .mobile-mode-pills-container,
  .input-bottom-area {
    display: none !important;
  }

  .image-previews-row {
    flex-wrap: nowrap;
    max-width: 100%;
    margin: 0 0 8px !important;
    padding: 0 8px;
    overflow-x: auto;
  }

  .image-preview-container {
    flex: 0 0 auto;
    max-width: 92px;
    border-radius: 14px;
  }

  .input-capsule-bar {
    align-items: center !important;
    min-height: 64px;
    padding: 6px 8px !important;
    gap: 4px !important;
    background: rgba(34, 37, 45, 0.96) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 34px !important;
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.24) !important;
    backdrop-filter: blur(18px) saturate(150%);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
  }

  .input-capsule-bar:hover,
  .input-capsule-bar:focus-within {
    transform: none !important;
    animation: none !important;
  }

  .capsule-icon-btn {
    width: 48px !important;
    height: 48px !important;
    border-radius: 50%;
    color: var(--text-color);
    font-size: 27px !important;
  }

  .upload-icon-desktop {
    display: none;
  }

  .upload-icon-mobile {
    display: block;
  }

  .input-capsule-textarea {
    min-width: 0;
    min-height: 48px !important;
    max-height: 128px;
    padding: 12px 4px !important;
    color: var(--text-color);
    font-size: 16px !important;
    line-height: 24px;
  }

  .prompt-history-panel {
    margin-top: 8px;
    padding: 0 4px;
  }

  .prompt-history-header {
    margin: 0 5px 5px;
    font-size: 11px;
  }

  .prompt-history-item {
    max-width: min(78vw, 320px);
    min-height: 32px;
  }

  .prompt-history-text {
    max-width: min(66vw, 270px);
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 12px;
  }

  .ai-enhance-icon-btn {
    width: 40px !important;
    margin: 0;
    font-size: 19px !important;
  }

  .submit-btn-wrapper {
    width: 48px !important;
    height: 48px !important;
    gap: 0 !important;
  }

  .capsule-submit-btn {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    background: var(--accent-color) !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .capsule-submit-btn:disabled {
    background: rgba(255, 255, 255, 0.12) !important;
  }

  .submit-icon-mobile {
    display: block;
    color: #fff;
    font-size: 23px !important;
    font-weight: 500;
  }

  .capsule-submit-btn:disabled .submit-icon-mobile {
    color: rgba(255, 255, 255, 0.35);
  }

  html[data-theme='light'] .input-container {
    background: linear-gradient(to top, #fff 58%, transparent) !important;
  }

  html[data-theme='light'] .input-capsule-bar {
    background: rgba(255, 255, 255, 0.98) !important;
    border-color: #e2e5e9 !important;
    box-shadow: 0 12px 34px rgba(60, 64, 67, 0.14) !important;
  }

  html[data-theme='light'] .capsule-icon-btn {
    color: #202124;
  }

  html[data-theme='light'] .capsule-submit-btn:disabled {
    background: #e3e5e8 !important;
  }

  html[data-theme='light'] .capsule-submit-btn:disabled .submit-icon-mobile {
    color: #8a8d91;
  }
}

/* 公告弹窗样式 */
.announcement-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 110000;
  backdrop-filter: blur(8px);
  animation: announcementFadeIn 0.3s ease;
}

@keyframes announcementFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.announcement-modal-content {
  background: linear-gradient(145deg, #1a1f35, #0f1320);
  border-radius: 20px;
  width: 90%;
  max-width: 520px;
  max-height: 80vh;
  overflow: hidden;
  position: relative;
  border: 1px solid rgba(0, 170, 255, 0.3);
  box-shadow: 
    0 20px 60px rgba(0, 0, 0, 0.5),
    0 0 40px rgba(0, 170, 255, 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  animation: announcementSlideIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes announcementSlideIn {
  from {
    opacity: 0;
    transform: scale(0.9) translateY(20px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

/* 关闭按钮 */
.announcement-close-btn {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.7);
  font-size: 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  z-index: 10;
}

.announcement-close-btn:hover {
  background: rgba(255, 77, 79, 0.2);
  border-color: rgba(255, 77, 79, 0.5);
  color: #ff4d4f;
  transform: rotate(90deg);
}

/* 头部 */
.announcement-header {
  padding: 28px 24px 20px;
  text-align: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(180deg, rgba(0, 170, 255, 0.08) 0%, transparent 100%);
}

.announcement-icon {
  font-size: 40px;
  color: #00aaff;
  display: block;
  margin-bottom: 12px;
  animation: iconPulse 2s ease-in-out infinite;
}

@keyframes iconPulse {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.1);
    opacity: 0.8;
  }
}

.announcement-header h2 {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: 1px;
}

/* 加载状态 */
.announcement-loading {
  padding: 60px 24px;
  text-align: center;
  color: rgba(255, 255, 255, 0.6);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.announcement-loading i {
  font-size: 32px;
  color: #00aaff;
}

.spinning {
  animation: spin 1s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* 空状态 */
.announcement-empty {
  padding: 60px 24px;
  text-align: center;
  color: rgba(255, 255, 255, 0.5);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.announcement-empty i {
  font-size: 48px;
  color: rgba(255, 255, 255, 0.3);
}

/* 公告列表 */
.announcement-list {
  padding: 20px;
  max-height: calc(80vh - 220px);
  overflow-y: auto;
}

.announcement-list::-webkit-scrollbar {
  width: 6px;
}

.announcement-list::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 3px;
}

.announcement-list::-webkit-scrollbar-thumb {
  background: rgba(0, 170, 255, 0.3);
  border-radius: 3px;
}

.announcement-list::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 170, 255, 0.5);
}

/* 单条公告 */
.announcement-item {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 16px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  transition: all 0.3s ease;
  position: relative;
}

/* 高亮的第一条公告 */
.announcement-item.highlight {
  background: linear-gradient(135deg, rgba(0, 170, 255, 0.15), rgba(0, 170, 255, 0.05));
  border: 1px solid rgba(0, 170, 255, 0.4);
  box-shadow: 0 4px 15px rgba(0, 170, 255, 0.15);
  /* overflow: hidden; */ /* 移除 overflow: hidden，防止内容被截断 */
}

.announcement-item.highlight::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: #00aaff;
  box-shadow: 0 0 10px #00aaff;
  border-radius: 12px 0 0 12px; /* 添加圆角，防止超出边框 */
}

.announcement-item.highlight .announcement-item-header h3 {
  color: #ffffff;
  text-shadow: 0 0 10px rgba(0, 170, 255, 0.5);
  font-size: 1.15rem;
}

.announcement-item.highlight:hover {
  border-color: rgba(0, 170, 255, 0.6);
  box-shadow: 0 6px 20px rgba(0, 170, 255, 0.25);
  transform: translateY(-2px);
}

.announcement-item:last-child {
  margin-bottom: 0;
}

.announcement-item:hover {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(0, 170, 255, 0.2);
}

.announcement-item-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
  gap: 12px;
}

.announcement-item-header h3 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 600;
  color: #00aaff;
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
}

.announcement-item-header h3 i {
  font-size: 18px;
}

.announcement-date {
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.4);
  white-space: nowrap;
  padding: 4px 10px;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 12px;
}

.announcement-content {
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.7;
  font-size: 0.95rem;
}

.announcement-content p {
  margin: 0 0 8px;
}

.announcement-content p:last-child {
  margin-bottom: 0;
}

/* 链接样式 - 高亮显示 */
.announcement-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #00e5ff;
  background: linear-gradient(135deg, rgba(0, 229, 255, 0.15), rgba(0, 170, 255, 0.1));
  padding: 6px 14px;
  border-radius: 20px;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.95rem;
  border: 1px solid rgba(0, 229, 255, 0.4);
  margin: 8px 4px;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 229, 255, 0.2);
  animation: linkGlow 2s ease-in-out infinite;
}

@keyframes linkGlow {
  0%, 100% {
    box-shadow: 0 2px 8px rgba(0, 229, 255, 0.2);
  }
  50% {
    box-shadow: 0 4px 20px rgba(0, 229, 255, 0.5);
  }
}

.announcement-link:hover {
  background: linear-gradient(135deg, rgba(0, 229, 255, 0.3), rgba(0, 170, 255, 0.25));
  border-color: #00e5ff;
  color: #ffffff;
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 6px 25px rgba(0, 229, 255, 0.5);
  text-decoration: none;
}

.announcement-link:active {
  transform: translateY(0) scale(1);
}

/* 底部 */
.announcement-footer {
  padding: 20px 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

/* 提示信息 */
.announcement-hint {
  display: flex;
  align-items: center;
  gap: 6px;
  color: rgba(255, 255, 255, 0.5);
  font-size: 0.85rem;
}

.announcement-hint i {
  font-size: 14px;
}

/* 确认按钮 */
.announcement-confirm-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 36px;
  background: linear-gradient(135deg, #00aaff, #0077cc);
  border: none;
  border-radius: 30px;
  color: #ffffff;
  font-size: 1.05rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 20px rgba(0, 170, 255, 0.4);
  min-width: 200px;
}

.announcement-confirm-btn i {
  font-size: 18px;
}

.announcement-confirm-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 30px rgba(0, 170, 255, 0.5);
  background: linear-gradient(135deg, #00bbff, #0088dd);
}

.announcement-confirm-btn:active {
  transform: translateY(0);
}

/* 响应式设计 */
@media (max-width: 768px) {
  .announcement-modal-content {
    width: 95%;
    max-height: 85vh;
    border-radius: 16px;
  }

  .announcement-header {
    padding: 24px 20px 16px;
  }

  .announcement-header h2 {
    font-size: 1.3rem;
  }

  .announcement-icon {
    font-size: 32px;
  }

  .announcement-list {
    padding: 16px;
  }

  .announcement-item {
    padding: 16px;
  }

  .announcement-item-header h3 {
    font-size: 1rem;
  }

  .announcement-footer {
    padding: 16px 20px;
    gap: 10px;
  }

  .announcement-confirm-btn {
    width: 100%;
    padding: 12px 24px;
  }

  .announcement-link {
    padding: 5px 12px;
    font-size: 0.9rem;
    margin: 6px 2px;
  }
}

@media (max-width: 480px) {
  .announcement-modal-content {
    border-radius: 12px;
  }

  .announcement-close-btn {
    width: 32px;
    height: 32px;
    font-size: 18px;
    top: 12px;
    right: 12px;
  }

  .announcement-header {
    padding: 20px 16px 14px;
  }

  .announcement-header h2 {
    font-size: 1.2rem;
  }

  .announcement-list {
    padding: 14px;
    max-height: calc(85vh - 200px);
  }

  .announcement-item {
    padding: 14px;
  }

  .announcement-content {
    font-size: 0.9rem;
  }

  .announcement-footer {
    padding: 14px 16px;
  }

  .dont-show-today {
    font-size: 0.85rem;
  }

  .announcement-confirm-btn {
    padding: 10px 20px;
    font-size: 0.95rem;
  }

  .announcement-link {
    padding: 4px 10px;
    font-size: 0.85rem;
    margin: 5px 2px;
  }

  .announcement-hint {
    font-size: 0.8rem;
  }
}

/* ==========================================
   亮色主题适配 (Light Theme Adaptation)
   ========================================== */
html[data-theme='light'] .announcement-modal-overlay {
  background-color: rgba(0, 0, 0, 0.4);
}

html[data-theme='light'] .announcement-modal-content {
  background: linear-gradient(145deg, #ffffff, #f0f4f9);
  border: 1px solid rgba(26, 115, 232, 0.2);
  box-shadow: 
    0 20px 60px rgba(0, 0, 0, 0.1),
    0 0 30px rgba(26, 115, 232, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

html[data-theme='light'] .announcement-close-btn {
  background: rgba(0, 0, 0, 0.05);
  border: 1px solid rgba(0, 0, 0, 0.05);
  color: var(--text-secondary);
}

html[data-theme='light'] .announcement-close-btn:hover {
  background: rgba(255, 77, 79, 0.1);
  border-color: rgba(255, 77, 79, 0.2);
  color: #ff4d4f;
}

html[data-theme='light'] .announcement-header {
  border-bottom: 1px solid var(--border-color);
  background: linear-gradient(180deg, rgba(26, 115, 232, 0.05) 0%, transparent 100%);
}

html[data-theme='light'] .announcement-icon {
  color: var(--accent-color);
}

html[data-theme='light'] .announcement-header h2 {
  color: var(--text-color);
}

html[data-theme='light'] .announcement-loading {
  color: var(--text-secondary);
}

html[data-theme='light'] .announcement-loading i {
  color: var(--accent-color);
}

html[data-theme='light'] .announcement-empty {
  color: var(--text-secondary);
}

html[data-theme='light'] .announcement-empty i {
  color: var(--border-color);
}

html[data-theme='light'] .announcement-list::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.03);
}

html[data-theme='light'] .announcement-list::-webkit-scrollbar-thumb {
  background: rgba(26, 115, 232, 0.2);
}

html[data-theme='light'] .announcement-list::-webkit-scrollbar-thumb:hover {
  background: rgba(26, 115, 232, 0.4);
}

html[data-theme='light'] .announcement-item {
  background: #ffffff;
  border: 1px solid var(--border-color);
}

html[data-theme='light'] .announcement-item:hover {
  background: #f8fafd;
  border-color: rgba(26, 115, 232, 0.2);
}

html[data-theme='light'] .announcement-item.highlight {
  background: linear-gradient(135deg, rgba(26, 115, 232, 0.08), rgba(26, 115, 232, 0.02));
  border: 1px solid rgba(26, 115, 232, 0.3);
  box-shadow: 0 4px 15px rgba(26, 115, 232, 0.08);
}

html[data-theme='light'] .announcement-item.highlight::before {
  background: var(--accent-color);
  box-shadow: 0 0 8px var(--accent-color);
}

html[data-theme='light'] .announcement-item.highlight .announcement-item-header h3 {
  color: var(--text-color);
  text-shadow: none;
}

html[data-theme='light'] .announcement-item.highlight:hover {
  border-color: rgba(26, 115, 232, 0.5);
  box-shadow: 0 6px 20px rgba(26, 115, 232, 0.15);
}

html[data-theme='light'] .announcement-item-header h3 {
  color: var(--accent-color);
}

html[data-theme='light'] .announcement-date {
  color: var(--text-secondary);
  background: rgba(0, 0, 0, 0.05);
}

html[data-theme='light'] .announcement-content {
  color: var(--text-color);
}

html[data-theme='light'] .announcement-link {
  color: var(--accent-color);
  background: rgba(26, 115, 232, 0.06);
  border: 1px solid rgba(26, 115, 232, 0.2);
  box-shadow: 0 2px 8px rgba(26, 115, 232, 0.05);
  animation: linkGlowLight 2s ease-in-out infinite;
}

html[data-theme='light'] .announcement-link:hover {
  background: rgba(26, 115, 232, 0.12);
  border-color: var(--accent-color);
  color: var(--accent-hover);
  box-shadow: 0 4px 15px rgba(26, 115, 232, 0.15);
}

html[data-theme='light'] .announcement-footer {
  border-top: 1px solid var(--border-color);
  background: rgba(0, 0, 0, 0.02);
}

html[data-theme='light'] .announcement-hint {
  color: var(--text-secondary);
}

html[data-theme='light'] .announcement-confirm-btn {
  background: linear-gradient(135deg, var(--accent-color), var(--accent-hover));
  box-shadow: 0 4px 15px rgba(26, 115, 232, 0.25);
}

html[data-theme='light'] .announcement-confirm-btn:hover {
  background: linear-gradient(135deg, var(--accent-hover), #0d47a1);
  box-shadow: 0 6px 20px rgba(26, 115, 232, 0.35);
}

@keyframes linkGlowLight {
  0%, 100% {
    box-shadow: 0 2px 8px rgba(26, 115, 232, 0.08);
  }
  50% {
    box-shadow: 0 4px 15px rgba(26, 115, 232, 0.25);
  }
}

html[data-theme='light'] .announcement-modal-overlay {
  background: rgba(32,33,36,.32) !important; backdrop-filter: blur(8px) !important;
}
html[data-theme='light'] .announcement-modal-content {
  color: var(--hm-ink) !important; background: rgba(255,255,255,.98) !important;
  border: 1px solid #dce3ec !important; border-radius: 22px !important;
  box-shadow: 0 24px 64px rgba(37,55,84,.18) !important;
}
html[data-theme='light'] .announcement-header {
  color: var(--hm-ink) !important; background: #fff !important; border-color: #e7ebf1 !important;
}
html[data-theme='light'] .announcement-content,
html[data-theme='light'] .announcement-list { color: var(--hm-muted) !important; }
html[data-theme='light'] .announcement-item {
  color: var(--hm-ink) !important; background: #f8fafd !important;
  border: 1px solid #e1e7ef !important; border-radius: 14px !important; box-shadow: none !important;
}
html[data-theme='light'] .announcement-item:hover {
  background: #fff !important; border-color: #b9cde8 !important; box-shadow: var(--hm-shadow-sm) !important;
}
html[data-theme='light'] .announcement-item.highlight {
  background: #eef5ff !important; border-color: #8eb6eb !important;
  box-shadow: 0 0 0 3px rgba(26,115,232,.08) !important;
}
html[data-theme='light'] .announcement-item-header,
html[data-theme='light'] .announcement-date { color: var(--hm-ink) !important; text-shadow: none !important; }
html[data-theme='light'] .announcement-hint { color: #77818c !important; }
html[data-theme='light'] .announcement-close-btn {
  color: #6d7681 !important; background: #f3f6fa !important;
  border: 1px solid #e0e6ee !important; border-radius: 10px !important;
}
html[data-theme='light'] .announcement-confirm-btn {
  color: #fff !important; background: var(--hm-blue) !important;
  border-color: var(--hm-blue) !important; border-radius: 11px !important;
  box-shadow: 0 8px 20px rgba(26,115,232,.18) !important;
}



/* InteractiveViewer组件样式 */
.threejs-viewer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: var(--background-color);
  border: none;
  border-radius: 0;
  box-shadow: none;
  z-index: 1100;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  /* 确保不受浏览器缩放影响 */
  max-width: 100vw;
  max-height: 100vh;
  /* 使用transform来保持布局稳定性 */
  transform: translateZ(0);
  /* 确保在所有缩放比例下都能正常显示 */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.threejs-viewer.fullscreen {
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  border-radius: 0;
}

.viewer-header {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 15px 20px;
  background: linear-gradient(135deg, var(--accent-color), #5a67d8);
  color: white;
  border-bottom: 1px solid var(--border-color);
  position: relative;
}

.viewer-header h3 {
  margin: 0;
  font-size: 1.2rem;
  display: flex;
  align-items: center;
  gap: 8px;
  position: absolute;
  left: 20px;
}

.viewer-controls {
  display: flex;
  gap: 8px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.control-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 8px 12px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  color: white;
  font-size: 0.9rem;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
}

.control-btn:hover {
  background: rgba(255, 255, 255, 0.2);
  transform: translateY(-1px);
}

.control-btn.close-btn {
  background: rgba(239, 68, 68, 0.8);
  border-color: rgba(239, 68, 68, 0.4);
}

.control-btn.close-btn:hover {
  background: rgba(239, 68, 68, 1);
}

.viewer-content {
  flex: 1;
  display: flex;
  position: relative;
  background: #f8f9fa;
}

.html-iframe {
  width: 100%;
  height: 100%;
  border: none;
  background: white;
  /* 确保iframe在不同缩放比例下保持正确显示 */
  display: block;
  overflow: hidden;
}

.no-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--text-secondary);
  font-size: 1.1rem;
}

.no-content i {
  font-size: 3rem;
  margin-bottom: 15px;
  opacity: 0.5;
}

.viewer-info {
  padding: 10px 20px;
  background: var(--background-secondary);
  border-top: 1px solid var(--border-color);
  font-size: 0.9rem;
  color: var(--text-secondary);
}

.viewer-info p {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.viewer-info i {
  color: var(--accent-color);
}

/* 移动端响应式优化 */
@media (max-width: 768px) {
  .threejs-viewer {
    /* 保持全屏显示，不改变尺寸 */
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
  }
  
  .viewer-header {
    padding: 12px 15px;
  }
  
  .viewer-header h3 {
    font-size: 1.1rem;
  }
  
  .viewer-controls {
    gap: 5px;
  }
  
  .control-btn {
    padding: 6px 10px;
    font-size: 0.85rem;
  }
  
  .control-btn span {
    display: none; /* 小屏幕上只显示图标 */
  }
  
  .viewer-info {
    padding: 8px 15px;
    font-size: 0.85rem;
  }
}

@media (max-width: 480px) {
  .threejs-viewer {
    /* 保持全屏显示，不改变尺寸 */
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
  }
  
  .viewer-header {
    padding: 10px;
  }
  
  .viewer-header h3 {
    font-size: 1rem;
  }
  
  .control-btn {
    padding: 5px 8px;
    min-width: 32px;
    justify-content: center;
  }
  
  .no-content {
    font-size: 1rem;
    padding: 0 15px;
    text-align: center;
  }
  
  .no-content i {
    font-size: 2.5rem;
    margin-bottom: 10px;
  }
} 
/* AnimationPlayer组件样式 */
.animation-container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
}

.preview-content {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9; /* 使用标准的 16:9 比例自适应，彻底消除上下黑边 */
  border-radius: 0 0 8px 8px;
  overflow: hidden;
  background-color: #000;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 50px 20px;
  color: var(--text-tertiary);
  text-align: center;
  flex: 1;
}

.empty-state i {
  font-size: 3rem;
  opacity: 0.5;
}

.loading-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 50px 20px;
  text-align: center;
  flex: 1;
}

.loading-state .spinner {
  width: 40px;
  height: 40px;
  border: 4px solid rgba(79, 109, 245, 0.3);
  border-top-color: var(--accent-color);
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 20px;
}

.error-state {
  background-color: rgba(255, 82, 82, 0.05);
  border-radius: 8px;
  padding: 20px;
  margin: 10px;
  text-align: center;
}

.error-state i {
  color: #ff5252;
  font-size: 2rem;
  margin-bottom: 15px;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.rendering-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px;
  text-align: center;
  flex: 1;
}

.rendering-state .spinner {
  width: 40px;
  height: 40px;
  border: 4px solid rgba(79, 109, 245, 0.3);
  border-top-color: var(--accent-color);
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 20px;
}

.rendering-state p {
  color: var(--text-secondary);
  margin: 5px 0;
}

.render-tip {
  font-size: 0.8rem;
  color: var(--text-tertiary);
  margin-top: 10px;
}

.video-player {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: transparent;
  position: relative;
}

.preview-content.has-video {
  height: auto;
  min-height: 0;
  aspect-ratio: auto;
  background-color: transparent;
}

.preview-content.has-video .animation-container {
  height: auto;
  min-height: 0;
  background-color: transparent;
}

.video-frame {
  width: 100%;
  overflow: hidden;
  border-radius: 8px 8px 0 0;
  background-color: #000;
}

.animation-player .video-frame video {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: contain;
  box-shadow: none;
  display: block;
}

.video-download-bar {
  width: 100%;
  display: flex;
  justify-content: center;
  padding: 10px 0 8px;
  background: #0d0d0d;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.video-download-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 20px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: rgba(255, 255, 255, 0.75);
  font-size: 13px;
  text-decoration: none;
  letter-spacing: 0.3px;
  transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
  cursor: pointer;
}

.video-download-btn i {
  font-size: 15px;
}

.video-download-btn:hover {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.35);
  color: #fff;
}

.render-error {
  background-color: rgba(255, 82, 82, 0.1);
  border: 1px solid rgba(255, 82, 82, 0.3);
  color: #ff5252;
  padding: 20px;
  border-radius: 8px;
  margin: 15px;
  text-align: center;
}

.render-error i {
  display: block;
  font-size: 2.5rem;
}

.render-error h3 {
  font-size: 1.2rem;
  margin-bottom: 15px;
  color: #ff5252;
}

.render-error pre {
  text-align: left;
  background-color: rgba(0, 0, 0, 0.1);
  padding: 12px;
  border-radius: 6px;
  overflow: auto;
  margin: 15px 0;
  font-size: 0.9rem;
  color: var(--text-secondary);
  white-space: pre-wrap;
  max-height: 200px;
}

.render-error-hint {
  color: var(--text-secondary);
  font-size: 1rem;
  line-height: 1.5;
}

.check-status-btn,
.test-server-btn,
.regenerate-btn {
  background-color: var(--accent-color);
  color: white;
  border: none;
  border-radius: 8px;
  padding: 0.75rem 1.5rem;
  margin-top: 15px;
  font-size: 0.95rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: all 0.3s ease;
}

.check-status-btn:hover:not(:disabled),
.test-server-btn:hover:not(:disabled),
.regenerate-btn:hover:not(:disabled) {
  background-color: var(--accent-hover);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(79, 109, 245, 0.3);
}

.check-status-btn:disabled,
.test-server-btn:disabled,
.regenerate-btn:disabled {
  background-color: #888;
  cursor: not-allowed;
}

.check-status-btn i,
.test-server-btn i,
.regenerate-btn i {
  font-size: 1.1rem;
}

.server-status {
  margin-top: 15px;
  padding: 12px 15px;
  border-radius: 6px;
  font-size: 0.9rem;
  display: flex;
  align-items: center;
  gap: 8px;
}

.server-status i {
  font-size: 1.1rem;
}

.server-status.success {
  background-color: rgba(76, 175, 80, 0.1);
  border-left: 3px solid var(--success-color);
  color: var(--success-color);
}

.server-status.error {
  background-color: rgba(255, 82, 82, 0.1);
  border-left: 3px solid var(--error-color);
  color: var(--error-color);
}

.code-container {
  width: 100%;
}

.code-header {
  display: flex;
  justify-content: flex-end;
  padding: 12px;
  background-color: rgba(0, 0, 0, 0.05);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.code-block {
  padding: 20px;
  margin: 0;
  overflow: auto;
  font-family: 'Roboto Mono', monospace;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--text-primary);
  background-color: var(--dark-gray);
  max-height: 400px;
  white-space: pre;
}

/* 移动端响应式优化 */
@media (max-width: 768px) {
  .preview-content {
    min-height: 300px;
    padding: 0;
  }
  
  .empty-state,
  .loading-state {
    padding: 30px 15px;
  }
  
  .empty-state i,
  .loading-state .spinner {
    margin-bottom: 15px;
  }
  
  .check-status-btn,
  .test-server-btn,
  .regenerate-btn {
    width: 100%;
    padding: 0.6rem 1rem;
    font-size: 0.9rem;
  }
  
  .server-status {
    padding: 10px;
    font-size: 0.85rem;
  }
  
  .code-header {
    padding: 8px;
  }
  
  .code-block {
    padding: 15px;
    font-size: 0.85rem;
    max-height: 350px;
  }
}

@media (max-width: 480px) {
  .preview-content {
    min-height: 250px;
  }
  
  .rendering-state {
    padding: 20px;
  }
  
  .rendering-state .spinner {
    width: 30px;
    height: 30px;
    margin-bottom: 15px;
  }
  
  .render-error {
    padding: 15px;
    font-size: 0.85rem;
    margin: 10px;
  }
  
  .render-error i {
    font-size: 2rem;
    margin-bottom: 10px;
  }
  
  .render-error h3 {
    font-size: 1.1rem;
    margin-bottom: 10px;
  }
  
  .render-error pre {
    padding: 8px;
    font-size: 0.8rem;
    max-height: 150px;
  }
  
  .render-error-hint {
    font-size: 0.9rem;
  }
}

/* ================================================
   RefinementDrawer - 二次编辑微调抽屉样式
   ================================================ */

/* 仅用于承载开场动画，不遮暗或模糊左侧预览 */
.refine-backdrop {
  position: fixed;
  inset: 0;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  z-index: 105000;
  pointer-events: none; /* 背景不拦截左侧点击，让用户感知对比 */
  animation: backdropFadeIn 0.3s ease forwards;
}

@keyframes backdropFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* 抽屉主体 */
.refine-drawer {
  position: fixed;
  top: var(--vv-top, 0);
  right: 0;
  bottom: 0;
  width: 48%;
  min-width: 320px;
  max-width: 820px;
  height: 100%;
  height: var(--vv-height, 100dvh);
  max-height: var(--vv-height, 100dvh);
  z-index: 105001;
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, #0d1117 0%, #0a0e16 100%);
  border-left: 1px solid #d3e3fd;
  box-shadow: -8px 0 40px rgba(0, 0, 0, 0.6), -2px 0 20px rgba(0, 170, 255, 0.08);
  transform: translateX(100%);
  transition: transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
  box-sizing: border-box;
}

.refine-drawer.open {
  transform: translateX(0);
}

/* ── 头部 ─────────────────────────────────────── */
.refine-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  padding-top: max(14px, env(safe-area-inset-top));
  padding-right: max(20px, env(safe-area-inset-right));
  background: linear-gradient(90deg, rgba(0, 170, 255, 0.08), transparent);
  border-bottom: 1px solid rgba(26, 115, 232, 0.1);
  flex-shrink: 0;
}

.refine-drawer-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 600;
  color: #e0e8ff;
}

.refine-drawer-title i {
  font-size: 20px;
  color: #1a73e8;
  filter: none;
}

.refine-drawer-subtitle {
  font-size: 12px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.45);
  border-left: 1px solid rgba(255, 255, 255, 0.15);
  padding-left: 10px;
  margin-left: 2px;
}

.refine-close-btn {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  color: rgba(255, 255, 255, 0.6);
  cursor: pointer;
  transition: all 0.2s ease;
  flex-shrink: 0;
}

.refine-close-btn:hover:not(:disabled) {
  background: rgba(255, 80, 80, 0.15);
  border-color: rgba(255, 80, 80, 0.4);
  color: #ff6b6b;
}

.refine-close-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

/* ── 主体（可滚动） ────────────────────────────── */
.refine-drawer-body {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.refine-drawer-body::-webkit-scrollbar {
  width: 4px;
}

.refine-drawer-body::-webkit-scrollbar-track {
  background: transparent;
}

.refine-drawer-body::-webkit-scrollbar-thumb {
  background: rgba(26, 115, 232, 0.14);
  border-radius: 4px;
}

/* ── 预览区 ───────────────────────────────────── */
.refine-preview-section {
  padding: 14px 16px 20px;
  animation: slideUp 0.35s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes slideUp {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

.refine-preview-label {
  font-size: 12px;
  font-weight: 600;
  color: #1a73e8;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.refine-result-preview {
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(26, 115, 232, 0.14);
  background: rgba(0, 10, 25, 0.6);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
  min-height: 240px;
  max-height: 420px;
  position: relative;
}

.refine-iframe-preview {
  min-height: 300px;
}

.refine-iframe {
  width: 100%;
  height: 380px;
  border: none;
  display: block;
}

.refine-code-preview {
  max-height: 260px;
  overflow-y: auto;
}

.refine-geogebra-preview {
  min-height: 380px;
  max-height: 460px;
}

.refine-code-block {
  margin: 0;
  padding: 16px;
  font-size: 11px;
  font-family: "Fira Code", "Consolas", monospace;
  color: rgba(0, 200, 100, 0.9);
  white-space: pre-wrap;
  word-break: break-all;
  line-height: 1.5;
}

/* ── 对话历史 ─────────────────────────────────── */
.refine-chat-history {
  flex: 1;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.refine-chat-empty {
  margin: auto;
  text-align: center;
  color: rgba(255, 255, 255, 0.35);
  padding: 40px 20px;
}

.refine-chat-empty i {
  font-size: 36px;
  color: #d3e3fd;
  display: block;
  margin-bottom: 12px;
}

.refine-chat-empty p {
  margin: 0 0 6px;
  font-size: 14px;
}

.refine-chat-hint {
  font-size: 12px !important;
  color: rgba(255, 255, 255, 0.2) !important;
}

/* 消息气泡 */
.refine-message {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  animation: msgFadeIn 0.25s ease forwards;
}

@keyframes msgFadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.refine-message-user {
  flex-direction: row-reverse;
}

.refine-message-avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 14px;
}

.refine-message-user .refine-message-avatar {
  background: #f0f4f9; border: 1px solid #d3e3fd;
  border: 1px solid #d3e3fd;
  color: #1a73e8;
}

.refine-message-assistant .refine-message-avatar {
  background: linear-gradient(135deg, rgba(100, 200, 100, 0.15), rgba(0, 150, 80, 0.2));
  border: 1px solid rgba(0, 180, 100, 0.25);
  color: #00cc66;
}

.refine-message-content {
  /* max-width: 80%;  <-- 移除这个限制，让wrapper控制 */
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 13.5px;
  line-height: 1.55;
  width: fit-content;
}

.refine-message-image {
  width: fit-content;
  max-width: min(260px, 100%);
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #d3e3fd;
  background: rgba(0, 10, 25, 0.4);
}

.refine-message-image img {
  display: block;
  max-width: 100%;
  max-height: 220px;
  object-fit: contain;
}

.refine-message-content-wrapper {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1; /* 占据剩余全部宽度，防止被短文本压缩 */
  min-width: 0; /* 防止内容溢出撑破flex */
  max-width: 90%; /* 稍微放宽一点最大宽度 */
}

.refine-result-container {
  width: 100%;
  margin-top: 4px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(26, 115, 232, 0.14);
  background: rgba(0, 10, 25, 0.4);
  animation: slideUp 0.3s ease forwards;
}

.refine-result-embedded {
  width: 100%;
  /* 移除全局 max-height，让各自的组件控制高度 */
  position: relative;
}

.refine-result-embedded .preview-content {
  min-height: 360px;
  border-radius: 12px;
}

.refine-result-embedded .video-player {
  min-height: 360px;
}

/* 针对不同类型的嵌入做微调 */
.refine-iframe-embedded {
  height: 450px; /* 修复3D模式嵌入没有高度的问题，增加高度 */
}

.refine-geogebra-embedded {
  height: 550px; /* 显著增加GGB的高度，避免被截断 */
}

.refine-message-user .refine-message-content-wrapper {
  align-items: flex-end;
}

.refine-message-assistant .refine-message-content-wrapper {
  align-items: flex-start;
}

.refine-message-user .refine-message-content {
  background: rgba(26, 115, 232, 0.1);
  border: 1px solid #d3e3fd;
  color: #d0e8ff;
  border-top-right-radius: 4px;
}

.refine-message-assistant .refine-message-content {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.09);
  color: rgba(255, 255, 255, 0.8);
  border-top-left-radius: 4px;
}

/* 生成中动画 */
.refine-loading-msg {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 140px;
  padding: 12px 16px;
}

.refine-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(0, 170, 255, 0.6);
  animation: dotBounce 1.2s infinite ease-in-out;
  flex-shrink: 0;
}

.refine-dot:nth-child(1) { animation-delay: 0s; }
.refine-dot:nth-child(2) { animation-delay: 0.2s; }
.refine-dot:nth-child(3) { animation-delay: 0.4s; }

@keyframes dotBounce {
  0%, 80%, 100% { transform: scale(0.7); opacity: 0.5; }
  40%           { transform: scale(1.1); opacity: 1; }
}

.refine-loading-text {
  font-size: 12.5px;
  color: rgba(255, 255, 255, 0.5);
  margin-left: 4px;
  flex-shrink: 0;
}

/* ── 输入区 ───────────────────────────────────── */
.refine-input-area {
  display: flex;
  gap: 10px;
  align-items: flex-end;
  padding: 12px 16px;
  padding-bottom: max(12px, env(safe-area-inset-bottom));
  padding-right: max(16px, env(safe-area-inset-right));
  padding-left: max(16px, env(safe-area-inset-left));
  border-top: 1px solid rgba(26, 115, 232, 0.08);
  background: rgba(0, 8, 20, 0.7);
  flex-shrink: 0 !important; /* 核心：绝不可被 flex 压缩，保证输入区完整可见 */
  box-sizing: border-box;
}

.refine-input-box {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.refine-input-row {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}

.refine-upload-btn {
  width: 42px;
  min-height: 42px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(26, 115, 232, 0.14);
  border-radius: 10px;
  color: rgba(255, 255, 255, 0.55);
  cursor: pointer;
  transition: all 0.2s ease;
}

.refine-upload-btn:hover:not(:disabled),
.refine-upload-btn.has-file {
  color: #1a73e8;
  border-color: #a8c7fa;
  background: rgba(26, 115, 232, 0.08);
}

.refine-upload-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.refine-upload-btn i {
  font-size: 18px;
}

.refine-upload-indicator {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 6px;
  height: 6px;
  background: #1a73e8;
  border-radius: 50%;
  box-shadow: none;
}

.refine-image-preview {
  position: relative;
  width: fit-content;
  max-width: 260px;
  max-height: clamp(70px, 16vh, 150px);
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #d3e3fd;
  background: rgba(0, 10, 25, 0.55);
}

.refine-image-preview img {
  display: block;
  max-width: 100%;
  max-height: clamp(70px, 16vh, 150px);
  object-fit: contain;
}

.refine-remove-image-btn {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  cursor: pointer;
  transition: background 0.2s ease;
}

.refine-remove-image-btn:hover:not(:disabled) {
  background: rgba(255, 80, 80, 0.75);
}

.refine-textarea {
  flex: 1;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(26, 115, 232, 0.14);
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 13.5px;
  color: #e0e8ff;
  resize: none;
  outline: none;
  font-family: inherit;
  line-height: 1.5;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  min-height: 46px;
  max-height: 110px;
  overflow-y: auto;
  box-sizing: border-box;
}

.refine-textarea::placeholder {
  color: rgba(255, 255, 255, 0.25);
  font-size: 13px;
}

.refine-textarea:focus {
  border-color: #a8c7fa;
  box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.08);
}

.refine-textarea:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.refine-send-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  background: #1a73e8;
  border: 1px solid #a8c7fa;
  border-radius: 10px;
  color: #fff;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s ease;
  flex-shrink: 0;
  height: fit-content;
  align-self: flex-end;
  min-height: 42px;
}

.refine-send-btn:hover:not(:disabled) {
  background: #1557b0;
  box-shadow: 0 4px 15px rgba(0, 170, 255, 0.35);
  transform: translateY(-1px);
}

.refine-send-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

.refine-send-btn i {
  font-size: 15px;
}

/* 旋转动画（用于loading状态） */
.rotating {
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* ── 片段选择条 ───────────────────────────────── */

.refine-segment-bar {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 16px 6px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(0, 0, 0, 0.15);
  flex-shrink: 0 !important;
}

.refine-segment-label {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.45);
  font-weight: 500;
  letter-spacing: 0.03em;
}

.refine-segment-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.refine-segment-chip {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.65);
  font-size: 12px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
  white-space: nowrap;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.refine-segment-chip:hover:not(:disabled) {
  background: rgba(0, 190, 255, 0.12);
  border-color: rgba(0, 190, 255, 0.4);
  color: rgba(0, 210, 255, 0.9);
}

.refine-segment-chip.active {
  background: rgba(26, 115, 232, 0.12);
  border-color: rgba(0, 190, 255, 0.6);
  color: rgba(0, 220, 255, 1);
  font-weight: 600;
}

.refine-segment-chip:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.refine-segment-hint {
  font-size: 11px;
  color: rgba(0, 200, 255, 0.7);
  font-style: italic;
}

/* 片段选择卡片样式 */
.refine-segment-cards {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding: 8px 4px;
  scroll-behavior: smooth;
}

.refine-segment-cards::-webkit-scrollbar {
  height: 4px;
}

.refine-segment-cards::-webkit-scrollbar-track {
  background: transparent;
}

.refine-segment-cards::-webkit-scrollbar-thumb {
  background: rgba(26, 115, 232, 0.14);
  border-radius: 4px;
}

/* 单个片段卡片 */
.refine-segment-card {
  flex: 0 0 120px;
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
  transition: all 0.2s ease;
  position: relative;
}

.refine-segment-card:hover:not(.disabled) {
  border-color: #a8c7fa;
  background: rgba(0, 170, 255, 0.05);
  transform: translateY(-2px);
}

.refine-segment-card.active {
  border-color: #1a73e8;
  background: rgba(26, 115, 232, 0.08);
  box-shadow: none;
}

.refine-segment-card.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.refine-segment-card.failed {
  border-color: rgba(255, 82, 82, 0.65);
  background: rgba(255, 82, 82, 0.08);
}

.refine-segment-card.failed .refine-segment-card-preview-placeholder,
.refine-segment-card.failed .refine-segment-card-desc {
  color: #ff6b6b;
}

/* 预览区域 */
.refine-segment-card-preview {
  position: relative;
  width: 100%;
  height: 68px;
  background: #000;
  overflow: hidden;
}

.refine-segment-video-preview {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.refine-segment-card-preview-placeholder {
  width: 100%;
  height: 68px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.4);
  color: rgba(255, 255, 255, 0.25);
}

.refine-segment-card-preview-placeholder i {
  font-size: 24px;
}

/* 角标 */
.refine-segment-card-badge {
  position: absolute;
  top: 4px;
  left: 6px;
  background: rgba(0, 0, 0, 0.65);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  padding: 1px 5px;
  border-radius: 4px;
  line-height: 1;
  z-index: 2;
}

/* 卡片信息 */
.refine-segment-card-info {
  padding: 6px 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.refine-segment-card-title {
  font-size: 11px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.8);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.refine-segment-card-all .refine-segment-card-preview-placeholder {
  height: 68px;
  background: #e8f0fe;
  color: #1a73e8;
}

.refine-segment-card-all .refine-segment-card-title {
  font-weight: 600;
  color: #1a73e8;
}

.refine-segment-card-desc {
  font-size: 9px;
  color: rgba(255, 255, 255, 0.35);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── 响应式 ───────────────────────────────────── */
@media (max-width: 900px) {
  .refine-backdrop {
    pointer-events: auto !important;
    background: rgba(0, 0, 0, 0.45) !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    cursor: pointer;
  }

  .refine-drawer {
    width: min(580px, 100%) !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-shadow: -4px 0 30px rgba(0, 0, 0, 0.5) !important;
  }
}

@media (max-width: 600px) {
  .refine-drawer {
    width: 100% !important;
    border-radius: 0 !important;
  }

  .refine-drawer-subtitle {
    display: none;
  }
}

/* 针对折叠屏横屏、矮屏幕或软键盘极高状态的紧凑适配 */
@media (max-height: 640px) {
  .refine-drawer-header {
    padding: 8px 14px;
    padding-top: max(8px, env(safe-area-inset-top));
  }
  .refine-drawer-title {
    font-size: 14px;
  }
  .refine-drawer-title i {
    font-size: 16px;
  }
  .refine-drawer-subtitle {
    display: none;
  }
  .refine-close-btn {
    width: 28px;
    height: 28px;
  }
  .refine-segment-bar {
    padding: 4px 10px 3px;
    gap: 3px;
  }
  .refine-segment-cards {
    padding: 3px 0;
    gap: 8px;
  }
  .refine-segment-card {
    flex: 0 0 96px;
  }
  .refine-segment-card-preview,
  .refine-segment-card-preview-placeholder {
    height: 44px;
  }
  .refine-segment-card-info {
    padding: 3px 6px;
  }
  .refine-image-preview {
    max-height: 80px;
  }
  .refine-image-preview img {
    max-height: 80px;
  }
  .refine-input-area {
    padding: 6px 12px;
    padding-bottom: max(6px, env(safe-area-inset-bottom));
  }
  .refine-textarea {
    min-height: 38px;
    max-height: 70px;
    padding: 6px 10px;
    font-size: 13px;
  }
  .refine-upload-btn,
  .refine-send-btn {
    min-height: 38px;
    height: 38px;
    padding: 6px 12px;
  }
}

@media (min-width: 901px) {
  html[data-theme='light'] .refine-backdrop {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}
@media (max-width: 900px) {
  html[data-theme='light'] .refine-backdrop {
    background: rgba(0, 0, 0, 0.4) !important;
    pointer-events: auto !important;
    cursor: pointer;
  }
}
html[data-theme='light'] .refine-drawer {
  color: var(--hm-ink) !important; background: rgba(255,255,255,.98) !important;
  border: 0 !important; border-left: 1px solid #dce3ec !important;
  border-radius: 22px 0 0 22px !important; box-shadow: -16px 0 48px rgba(37,55,84,.16) !important;
}
html[data-theme='light'] .refine-drawer-header {
  color: var(--hm-ink) !important; background: #fff !important; border-color: #e7ebf1 !important;
}
html[data-theme='light'] .refine-drawer-title { color: var(--hm-ink) !important; text-shadow: none !important; }
html[data-theme='light'] .refine-drawer-subtitle,
html[data-theme='light'] .refine-chat-hint { color: var(--hm-muted) !important; }
html[data-theme='light'] .refine-chat-empty,
html[data-theme='light'] .refine-input-area,
html[data-theme='light'] .refine-result-container,
html[data-theme='light'] .refine-segment-card {
  color: var(--hm-ink) !important; background: #f8fafd !important;
  border: 1px solid #e1e7ef !important; border-radius: 14px !important; box-shadow: none !important;
}
html[data-theme='light'] .refine-segment-card:hover {
  background: #fff !important; border-color: #b9cde8 !important; box-shadow: var(--hm-shadow-sm) !important;
}
html[data-theme='light'] .refine-segment-card.active {
  background: #eef5ff !important; border-color: #8eb6eb !important;
  box-shadow: 0 0 0 3px rgba(26,115,232,.08) !important;
}
html[data-theme='light'] .refine-segment-card-title { color: var(--hm-ink) !important; }
html[data-theme='light'] .refine-segment-card-desc { color: #77818c !important; }
html[data-theme='light'] .refine-textarea {
  color: var(--hm-ink) !important; background: #fff !important;
  border: 1px solid #cfd9e6 !important; border-radius: 11px !important; box-shadow: none !important;
}
html[data-theme='light'] .refine-close-btn,
html[data-theme='light'] .refine-upload-btn {
  color: #4f5965 !important; background: #fff !important;
  border: 1px solid #d8e1ec !important; border-radius: 11px !important;
}
html[data-theme='light'] .refine-send-btn {
  color: #fff !important; background: var(--hm-blue) !important;
  border-color: var(--hm-blue) !important; border-radius: 11px !important;
  box-shadow: 0 8px 20px rgba(26,115,232,.18) !important;
}
html[data-theme='light'] .refine-message-assistant {
  color: #38424e !important; background: #f3f6fa !important; border-color: #e0e6ee !important;
}
html[data-theme='light'] .refine-message-user {
  color: #fff !important; background: var(--hm-blue) !important; border-color: var(--hm-blue) !important;
}

@font-face{font-display:block;font-family:KaTeX_AMS;font-style:normal;font-weight:400;src:url(/KaTeX_AMS-Regular.8133ac94.woff2) format("woff2"),url(/KaTeX_AMS-Regular.dcc23d07.woff) format("woff"),url(/KaTeX_AMS-Regular.859e98c0.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Caligraphic;font-style:normal;font-weight:700;src:url(/KaTeX_Caligraphic-Bold.d3c5f12b.woff2) format("woff2"),url(/KaTeX_Caligraphic-Bold.93fdc334.woff) format("woff"),url(/KaTeX_Caligraphic-Bold.da98656b.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Caligraphic;font-style:normal;font-weight:400;src:url(/KaTeX_Caligraphic-Regular.2ee9ed59.woff2) format("woff2"),url(/KaTeX_Caligraphic-Regular.7d2265ee.woff) format("woff"),url(/KaTeX_Caligraphic-Regular.646cd5df.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Fraktur;font-style:normal;font-weight:700;src:url(/KaTeX_Fraktur-Bold.65593f2a.woff2) format("woff2"),url(/KaTeX_Fraktur-Bold.8aff230a.woff) format("woff"),url(/KaTeX_Fraktur-Bold.5114d75d.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Fraktur;font-style:normal;font-weight:400;src:url(/KaTeX_Fraktur-Regular.104f2c68.woff2) format("woff2"),url(/KaTeX_Fraktur-Regular.857bb4f7.woff) format("woff"),url(/KaTeX_Fraktur-Regular.879d5dc4.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Main;font-style:normal;font-weight:700;src:url(/KaTeX_Main-Bold.6c9a021e.woff2) format("woff2"),url(/KaTeX_Main-Bold.96960ed2.woff) format("woff"),url(/KaTeX_Main-Bold.5120c209.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Main;font-style:italic;font-weight:700;src:url(/KaTeX_Main-BoldItalic.31e7d520.woff2) format("woff2"),url(/KaTeX_Main-BoldItalic.78bb92be.woff) format("woff"),url(/KaTeX_Main-BoldItalic.7fbd624a.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Main;font-style:italic;font-weight:400;src:url(/KaTeX_Main-Italic.eb6e6008.woff2) format("woff2"),url(/KaTeX_Main-Italic.8938eceb.woff) format("woff"),url(/KaTeX_Main-Italic.9c07e90e.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Main;font-style:normal;font-weight:400;src:url(/KaTeX_Main-Regular.433c8d92.woff2) format("woff2"),url(/KaTeX_Main-Regular.81c1cd0f.woff) format("woff"),url(/KaTeX_Main-Regular.8804f1d5.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Math;font-style:italic;font-weight:700;src:url(/KaTeX_Math-BoldItalic.5910ee79.woff2) format("woff2"),url(/KaTeX_Math-BoldItalic.d9893cda.woff) format("woff"),url(/KaTeX_Math-BoldItalic.337db0bc.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Math;font-style:italic;font-weight:400;src:url(/KaTeX_Math-Italic.74a6f356.woff2) format("woff2"),url(/KaTeX_Math-Italic.e865f0dc.woff) format("woff"),url(/KaTeX_Math-Italic.995b250a.ttf) format("truetype")}@font-face{font-display:block;font-family:"KaTeX_SansSerif";font-style:normal;font-weight:700;src:url(/KaTeX_SansSerif-Bold.bb332da1.woff2) format("woff2"),url(/KaTeX_SansSerif-Bold.5f0fb2a3.woff) format("woff"),url(/KaTeX_SansSerif-Bold.d03bee32.ttf) format("truetype")}@font-face{font-display:block;font-family:"KaTeX_SansSerif";font-style:italic;font-weight:400;src:url(/KaTeX_SansSerif-Italic.9754115b.woff2) format("woff2"),url(/KaTeX_SansSerif-Italic.3cf5d09b.woff) format("woff"),url(/KaTeX_SansSerif-Italic.391d1174.ttf) format("truetype")}@font-face{font-display:block;font-family:"KaTeX_SansSerif";font-style:normal;font-weight:400;src:url(/KaTeX_SansSerif-Regular.9f2ae4ea.woff2) format("woff2"),url(/KaTeX_SansSerif-Regular.bf183a2f.woff) format("woff"),url(/KaTeX_SansSerif-Regular.1c4edf39.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Script;font-style:normal;font-weight:400;src:url(/KaTeX_Script-Regular.d6906f00.woff2) format("woff2"),url(/KaTeX_Script-Regular.a62fe573.woff) format("woff"),url(/KaTeX_Script-Regular.c1460184.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Size1;font-style:normal;font-weight:400;src:url(/KaTeX_Size1-Regular.303ef8a3.woff2) format("woff2"),url(/KaTeX_Size1-Regular.180dae7b.woff) format("woff"),url(/KaTeX_Size1-Regular.eac1a48a.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Size2;font-style:normal;font-weight:400;src:url(/KaTeX_Size2-Regular.286ed316.woff2) format("woff2"),url(/KaTeX_Size2-Regular.21318dc6.woff) format("woff"),url(/KaTeX_Size2-Regular.9fa0a57a.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Size3;font-style:normal;font-weight:400;src:url(/KaTeX_Size3-Regular.3e39a8d5.woff2) format("woff2"),url(/KaTeX_Size3-Regular.8c7393a0.woff) format("woff"),url(/KaTeX_Size3-Regular.2b372da5.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Size4;font-style:normal;font-weight:400;src:url(/KaTeX_Size4-Regular.9b430e50.woff2) format("woff2"),url(/KaTeX_Size4-Regular.11360dc6.woff) format("woff"),url(/KaTeX_Size4-Regular.253e6859.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Typewriter;font-style:normal;font-weight:400;src:url(/KaTeX_Typewriter-Regular.99a40fa0.woff2) format("woff2"),url(/KaTeX_Typewriter-Regular.d6dbc77a.woff) format("woff"),url(/KaTeX_Typewriter-Regular.2b3354ae.ttf) format("truetype")}.katex{font:normal 1.21em KaTeX_Main,Times New Roman,serif;line-height:1.2;position:relative;text-indent:0;text-rendering:auto}.katex *{-ms-high-contrast-adjust:none!important;border-color:currentColor}.katex .katex-version:after{content:"0.16.47"}.katex .katex-mathml{border:0;-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;overflow:hidden;padding:0;position:absolute;width:1px}.katex .katex-html>.newline{display:block}.katex .base{position:relative;white-space:nowrap;width:-webkit-min-content;width:-moz-min-content;width:min-content}.katex .base,.katex .strut{display:inline-block}.katex .textbf{font-weight:700}.katex .textit{font-style:italic}.katex .textrm{font-family:KaTeX_Main}.katex .textsf{font-family:KaTeX_SansSerif}.katex .texttt{font-family:KaTeX_Typewriter}.katex .mathnormal{font-family:KaTeX_Math;font-style:italic}.katex .mathit{font-family:KaTeX_Main;font-style:italic}.katex .mathrm{font-style:normal}.katex .mathbf{font-family:KaTeX_Main;font-weight:700}.katex .boldsymbol{font-family:KaTeX_Math;font-style:italic;font-weight:700}.katex .amsrm,.katex .mathbb,.katex .textbb{font-family:KaTeX_AMS}.katex .mathcal{font-family:KaTeX_Caligraphic}.katex .mathfrak,.katex .textfrak{font-family:KaTeX_Fraktur}.katex .mathboldfrak,.katex .textboldfrak{font-family:KaTeX_Fraktur;font-weight:700}.katex .mathtt{font-family:KaTeX_Typewriter}.katex .mathscr,.katex .textscr{font-family:KaTeX_Script}.katex .mathsf,.katex .textsf{font-family:KaTeX_SansSerif}.katex .mathboldsf,.katex .textboldsf{font-family:KaTeX_SansSerif;font-weight:700}.katex .mathitsf,.katex .mathsfit,.katex .textitsf{font-family:KaTeX_SansSerif;font-style:italic}.katex .mainrm{font-family:KaTeX_Main;font-style:normal}.katex .vlist-t{border-collapse:collapse;display:inline-table;table-layout:fixed}.katex .vlist-r{display:table-row}.katex .vlist{display:table-cell;position:relative;vertical-align:bottom}.katex .vlist>span{display:block;height:0;position:relative}.katex .vlist>span>span{display:inline-block}.katex .vlist>span>.pstrut{overflow:hidden;width:0}.katex .vlist-t2{margin-right:-2px}.katex .vlist-s{display:table-cell;font-size:1px;min-width:2px;vertical-align:bottom;width:2px}.katex .vbox{align-items:baseline;display:inline-flex;flex-direction:column}.katex .hbox{width:100%}.katex .hbox,.katex .thinbox{display:inline-flex;flex-direction:row}.katex .thinbox{max-width:0;width:0}.katex .msupsub{text-align:left}.katex .mfrac>span>span{text-align:center}.katex .mfrac .frac-line{border-bottom-style:solid;display:inline-block;width:100%}.katex .hdashline,.katex .hline,.katex .mfrac .frac-line,.katex .overline .overline-line,.katex .rule,.katex .underline .underline-line{min-height:1px}.katex .mspace{display:inline-block}.katex .smash{display:inline;line-height:0}.katex .clap,.katex .llap,.katex .rlap{position:relative;width:0}.katex .clap>.inner,.katex .llap>.inner,.katex .rlap>.inner{position:absolute}.katex .clap>.fix,.katex .llap>.fix,.katex .rlap>.fix{display:inline-block}.katex .llap>.inner{right:0}.katex .clap>.inner,.katex .rlap>.inner{left:0}.katex .clap>.inner>span{margin-left:-50%;margin-right:50%}.katex .rule{border:0 solid;display:inline-block;position:relative}.katex .hline,.katex .overline .overline-line,.katex .underline .underline-line{border-bottom-style:solid;display:inline-block;width:100%}.katex .hdashline{border-bottom-style:dashed;display:inline-block;width:100%}.katex .sqrt>.root{margin-left:.2777777778em;margin-right:-.5555555556em}.katex .fontsize-ensurer.reset-size1.size1,.katex .sizing.reset-size1.size1{font-size:1em}.katex .fontsize-ensurer.reset-size1.size2,.katex .sizing.reset-size1.size2{font-size:1.2em}.katex .fontsize-ensurer.reset-size1.size3,.katex .sizing.reset-size1.size3{font-size:1.4em}.katex .fontsize-ensurer.reset-size1.size4,.katex .sizing.reset-size1.size4{font-size:1.6em}.katex .fontsize-ensurer.reset-size1.size5,.katex .sizing.reset-size1.size5{font-size:1.8em}.katex .fontsize-ensurer.reset-size1.size6,.katex .sizing.reset-size1.size6{font-size:2em}.katex .fontsize-ensurer.reset-size1.size7,.katex .sizing.reset-size1.size7{font-size:2.4em}.katex .fontsize-ensurer.reset-size1.size8,.katex .sizing.reset-size1.size8{font-size:2.88em}.katex .fontsize-ensurer.reset-size1.size9,.katex .sizing.reset-size1.size9{font-size:3.456em}.katex .fontsize-ensurer.reset-size1.size10,.katex .sizing.reset-size1.size10{font-size:4.148em}.katex .fontsize-ensurer.reset-size1.size11,.katex .sizing.reset-size1.size11{font-size:4.976em}.katex .fontsize-ensurer.reset-size2.size1,.katex .sizing.reset-size2.size1{font-size:.8333333333em}.katex .fontsize-ensurer.reset-size2.size2,.katex .sizing.reset-size2.size2{font-size:1em}.katex .fontsize-ensurer.reset-size2.size3,.katex .sizing.reset-size2.size3{font-size:1.1666666667em}.katex .fontsize-ensurer.reset-size2.size4,.katex .sizing.reset-size2.size4{font-size:1.3333333333em}.katex .fontsize-ensurer.reset-size2.size5,.katex .sizing.reset-size2.size5{font-size:1.5em}.katex .fontsize-ensurer.reset-size2.size6,.katex .sizing.reset-size2.size6{font-size:1.6666666667em}.katex .fontsize-ensurer.reset-size2.size7,.katex .sizing.reset-size2.size7{font-size:2em}.katex .fontsize-ensurer.reset-size2.size8,.katex .sizing.reset-size2.size8{font-size:2.4em}.katex .fontsize-ensurer.reset-size2.size9,.katex .sizing.reset-size2.size9{font-size:2.88em}.katex .fontsize-ensurer.reset-size2.size10,.katex .sizing.reset-size2.size10{font-size:3.4566666667em}.katex .fontsize-ensurer.reset-size2.size11,.katex .sizing.reset-size2.size11{font-size:4.1466666667em}.katex .fontsize-ensurer.reset-size3.size1,.katex .sizing.reset-size3.size1{font-size:.7142857143em}.katex .fontsize-ensurer.reset-size3.size2,.katex .sizing.reset-size3.size2{font-size:.8571428571em}.katex .fontsize-ensurer.reset-size3.size3,.katex .sizing.reset-size3.size3{font-size:1em}.katex .fontsize-ensurer.reset-size3.size4,.katex .sizing.reset-size3.size4{font-size:1.1428571429em}.katex .fontsize-ensurer.reset-size3.size5,.katex .sizing.reset-size3.size5{font-size:1.2857142857em}.katex .fontsize-ensurer.reset-size3.size6,.katex .sizing.reset-size3.size6{font-size:1.4285714286em}.katex .fontsize-ensurer.reset-size3.size7,.katex .sizing.reset-size3.size7{font-size:1.7142857143em}.katex .fontsize-ensurer.reset-size3.size8,.katex .sizing.reset-size3.size8{font-size:2.0571428571em}.katex .fontsize-ensurer.reset-size3.size9,.katex .sizing.reset-size3.size9{font-size:2.4685714286em}.katex .fontsize-ensurer.reset-size3.size10,.katex .sizing.reset-size3.size10{font-size:2.9628571429em}.katex .fontsize-ensurer.reset-size3.size11,.katex .sizing.reset-size3.size11{font-size:3.5542857143em}.katex .fontsize-ensurer.reset-size4.size1,.katex .sizing.reset-size4.size1{font-size:.625em}.katex .fontsize-ensurer.reset-size4.size2,.katex .sizing.reset-size4.size2{font-size:.75em}.katex .fontsize-ensurer.reset-size4.size3,.katex .sizing.reset-size4.size3{font-size:.875em}.katex .fontsize-ensurer.reset-size4.size4,.katex .sizing.reset-size4.size4{font-size:1em}.katex .fontsize-ensurer.reset-size4.size5,.katex .sizing.reset-size4.size5{font-size:1.125em}.katex .fontsize-ensurer.reset-size4.size6,.katex .sizing.reset-size4.size6{font-size:1.25em}.katex .fontsize-ensurer.reset-size4.size7,.katex .sizing.reset-size4.size7{font-size:1.5em}.katex .fontsize-ensurer.reset-size4.size8,.katex .sizing.reset-size4.size8{font-size:1.8em}.katex .fontsize-ensurer.reset-size4.size9,.katex .sizing.reset-size4.size9{font-size:2.16em}.katex .fontsize-ensurer.reset-size4.size10,.katex .sizing.reset-size4.size10{font-size:2.5925em}.katex .fontsize-ensurer.reset-size4.size11,.katex .sizing.reset-size4.size11{font-size:3.11em}.katex .fontsize-ensurer.reset-size5.size1,.katex .sizing.reset-size5.size1{font-size:.5555555556em}.katex .fontsize-ensurer.reset-size5.size2,.katex .sizing.reset-size5.size2{font-size:.6666666667em}.katex .fontsize-ensurer.reset-size5.size3,.katex .sizing.reset-size5.size3{font-size:.7777777778em}.katex .fontsize-ensurer.reset-size5.size4,.katex .sizing.reset-size5.size4{font-size:.8888888889em}.katex .fontsize-ensurer.reset-size5.size5,.katex .sizing.reset-size5.size5{font-size:1em}.katex .fontsize-ensurer.reset-size5.size6,.katex .sizing.reset-size5.size6{font-size:1.1111111111em}.katex .fontsize-ensurer.reset-size5.size7,.katex .sizing.reset-size5.size7{font-size:1.3333333333em}.katex .fontsize-ensurer.reset-size5.size8,.katex .sizing.reset-size5.size8{font-size:1.6em}.katex .fontsize-ensurer.reset-size5.size9,.katex .sizing.reset-size5.size9{font-size:1.92em}.katex .fontsize-ensurer.reset-size5.size10,.katex .sizing.reset-size5.size10{font-size:2.3044444444em}.katex .fontsize-ensurer.reset-size5.size11,.katex .sizing.reset-size5.size11{font-size:2.7644444444em}.katex .fontsize-ensurer.reset-size6.size1,.katex .sizing.reset-size6.size1{font-size:.5em}.katex .fontsize-ensurer.reset-size6.size2,.katex .sizing.reset-size6.size2{font-size:.6em}.katex .fontsize-ensurer.reset-size6.size3,.katex .sizing.reset-size6.size3{font-size:.7em}.katex .fontsize-ensurer.reset-size6.size4,.katex .sizing.reset-size6.size4{font-size:.8em}.katex .fontsize-ensurer.reset-size6.size5,.katex .sizing.reset-size6.size5{font-size:.9em}.katex .fontsize-ensurer.reset-size6.size6,.katex .sizing.reset-size6.size6{font-size:1em}.katex .fontsize-ensurer.reset-size6.size7,.katex .sizing.reset-size6.size7{font-size:1.2em}.katex .fontsize-ensurer.reset-size6.size8,.katex .sizing.reset-size6.size8{font-size:1.44em}.katex .fontsize-ensurer.reset-size6.size9,.katex .sizing.reset-size6.size9{font-size:1.728em}.katex .fontsize-ensurer.reset-size6.size10,.katex .sizing.reset-size6.size10{font-size:2.074em}.katex .fontsize-ensurer.reset-size6.size11,.katex .sizing.reset-size6.size11{font-size:2.488em}.katex .fontsize-ensurer.reset-size7.size1,.katex .sizing.reset-size7.size1{font-size:.4166666667em}.katex .fontsize-ensurer.reset-size7.size2,.katex .sizing.reset-size7.size2{font-size:.5em}.katex .fontsize-ensurer.reset-size7.size3,.katex .sizing.reset-size7.size3{font-size:.5833333333em}.katex .fontsize-ensurer.reset-size7.size4,.katex .sizing.reset-size7.size4{font-size:.6666666667em}.katex .fontsize-ensurer.reset-size7.size5,.katex .sizing.reset-size7.size5{font-size:.75em}.katex .fontsize-ensurer.reset-size7.size6,.katex .sizing.reset-size7.size6{font-size:.8333333333em}.katex .fontsize-ensurer.reset-size7.size7,.katex .sizing.reset-size7.size7{font-size:1em}.katex .fontsize-ensurer.reset-size7.size8,.katex .sizing.reset-size7.size8{font-size:1.2em}.katex .fontsize-ensurer.reset-size7.size9,.katex .sizing.reset-size7.size9{font-size:1.44em}.katex .fontsize-ensurer.reset-size7.size10,.katex .sizing.reset-size7.size10{font-size:1.7283333333em}.katex .fontsize-ensurer.reset-size7.size11,.katex .sizing.reset-size7.size11{font-size:2.0733333333em}.katex .fontsize-ensurer.reset-size8.size1,.katex .sizing.reset-size8.size1{font-size:.3472222222em}.katex .fontsize-ensurer.reset-size8.size2,.katex .sizing.reset-size8.size2{font-size:.4166666667em}.katex .fontsize-ensurer.reset-size8.size3,.katex .sizing.reset-size8.size3{font-size:.4861111111em}.katex .fontsize-ensurer.reset-size8.size4,.katex .sizing.reset-size8.size4{font-size:.5555555556em}.katex .fontsize-ensurer.reset-size8.size5,.katex .sizing.reset-size8.size5{font-size:.625em}.katex .fontsize-ensurer.reset-size8.size6,.katex .sizing.reset-size8.size6{font-size:.6944444444em}.katex .fontsize-ensurer.reset-size8.size7,.katex .sizing.reset-size8.size7{font-size:.8333333333em}.katex .fontsize-ensurer.reset-size8.size8,.katex .sizing.reset-size8.size8{font-size:1em}.katex .fontsize-ensurer.reset-size8.size9,.katex .sizing.reset-size8.size9{font-size:1.2em}.katex .fontsize-ensurer.reset-size8.size10,.katex .sizing.reset-size8.size10{font-size:1.4402777778em}.katex .fontsize-ensurer.reset-size8.size11,.katex .sizing.reset-size8.size11{font-size:1.7277777778em}.katex .fontsize-ensurer.reset-size9.size1,.katex .sizing.reset-size9.size1{font-size:.2893518519em}.katex .fontsize-ensurer.reset-size9.size2,.katex .sizing.reset-size9.size2{font-size:.3472222222em}.katex .fontsize-ensurer.reset-size9.size3,.katex .sizing.reset-size9.size3{font-size:.4050925926em}.katex .fontsize-ensurer.reset-size9.size4,.katex .sizing.reset-size9.size4{font-size:.462962963em}.katex .fontsize-ensurer.reset-size9.size5,.katex .sizing.reset-size9.size5{font-size:.5208333333em}.katex .fontsize-ensurer.reset-size9.size6,.katex .sizing.reset-size9.size6{font-size:.5787037037em}.katex .fontsize-ensurer.reset-size9.size7,.katex .sizing.reset-size9.size7{font-size:.6944444444em}.katex .fontsize-ensurer.reset-size9.size8,.katex .sizing.reset-size9.size8{font-size:.8333333333em}.katex .fontsize-ensurer.reset-size9.size9,.katex .sizing.reset-size9.size9{font-size:1em}.katex .fontsize-ensurer.reset-size9.size10,.katex .sizing.reset-size9.size10{font-size:1.2002314815em}.katex .fontsize-ensurer.reset-size9.size11,.katex .sizing.reset-size9.size11{font-size:1.4398148148em}.katex .fontsize-ensurer.reset-size10.size1,.katex .sizing.reset-size10.size1{font-size:.2410800386em}.katex .fontsize-ensurer.reset-size10.size2,.katex .sizing.reset-size10.size2{font-size:.2892960463em}.katex .fontsize-ensurer.reset-size10.size3,.katex .sizing.reset-size10.size3{font-size:.337512054em}.katex .fontsize-ensurer.reset-size10.size4,.katex .sizing.reset-size10.size4{font-size:.3857280617em}.katex .fontsize-ensurer.reset-size10.size5,.katex .sizing.reset-size10.size5{font-size:.4339440694em}.katex .fontsize-ensurer.reset-size10.size6,.katex .sizing.reset-size10.size6{font-size:.4821600771em}.katex .fontsize-ensurer.reset-size10.size7,.katex .sizing.reset-size10.size7{font-size:.5785920926em}.katex .fontsize-ensurer.reset-size10.size8,.katex .sizing.reset-size10.size8{font-size:.6943105111em}.katex .fontsize-ensurer.reset-size10.size9,.katex .sizing.reset-size10.size9{font-size:.8331726133em}.katex .fontsize-ensurer.reset-size10.size10,.katex .sizing.reset-size10.size10{font-size:1em}.katex .fontsize-ensurer.reset-size10.size11,.katex .sizing.reset-size10.size11{font-size:1.1996142719em}.katex .fontsize-ensurer.reset-size11.size1,.katex .sizing.reset-size11.size1{font-size:.2009646302em}.katex .fontsize-ensurer.reset-size11.size2,.katex .sizing.reset-size11.size2{font-size:.2411575563em}.katex .fontsize-ensurer.reset-size11.size3,.katex .sizing.reset-size11.size3{font-size:.2813504823em}.katex .fontsize-ensurer.reset-size11.size4,.katex .sizing.reset-size11.size4{font-size:.3215434084em}.katex .fontsize-ensurer.reset-size11.size5,.katex .sizing.reset-size11.size5{font-size:.3617363344em}.katex .fontsize-ensurer.reset-size11.size6,.katex .sizing.reset-size11.size6{font-size:.4019292605em}.katex .fontsize-ensurer.reset-size11.size7,.katex .sizing.reset-size11.size7{font-size:.4823151125em}.katex .fontsize-ensurer.reset-size11.size8,.katex .sizing.reset-size11.size8{font-size:.578778135em}.katex .fontsize-ensurer.reset-size11.size9,.katex .sizing.reset-size11.size9{font-size:.6945337621em}.katex .fontsize-ensurer.reset-size11.size10,.katex .sizing.reset-size11.size10{font-size:.8336012862em}.katex .fontsize-ensurer.reset-size11.size11,.katex .sizing.reset-size11.size11{font-size:1em}.katex .delimsizing.size1{font-family:KaTeX_Size1}.katex .delimsizing.size2{font-family:KaTeX_Size2}.katex .delimsizing.size3{font-family:KaTeX_Size3}.katex .delimsizing.size4{font-family:KaTeX_Size4}.katex .delimsizing.mult .delim-size1>span{font-family:KaTeX_Size1}.katex .delimsizing.mult .delim-size4>span{font-family:KaTeX_Size4}.katex .nulldelimiter{display:inline-block;width:.12em}.katex .delimcenter,.katex .op-symbol{position:relative}.katex .op-symbol.small-op{font-family:KaTeX_Size1}.katex .op-symbol.large-op{font-family:KaTeX_Size2}.katex .accent>.vlist-t,.katex .op-limits>.vlist-t{text-align:center}.katex .accent .accent-body{position:relative}.katex .accent .accent-body:not(.accent-full){width:0}.katex .overlay{display:block}.katex .mtable .vertical-separator{display:inline-block;min-width:1px}.katex .mtable .arraycolsep{display:inline-block}.katex .mtable .col-align-c>.vlist-t{text-align:center}.katex .mtable .col-align-l>.vlist-t{text-align:left}.katex .mtable .col-align-r>.vlist-t{text-align:right}.katex .svg-align{text-align:left}.katex svg{fill:currentColor;stroke:currentColor;display:block;height:inherit;position:absolute;width:100%}.katex svg path{stroke:none}.katex svg{fill-rule:nonzero;fill-opacity:1;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1}.katex img{border-style:none;max-height:none;max-width:none;min-height:0;min-width:0}.katex .stretchy{display:block;overflow:hidden;position:relative;width:100%}.katex .stretchy:after,.katex .stretchy:before{content:""}.katex .hide-tail{overflow:hidden;position:relative;width:100%}.katex .halfarrow-left{left:0;overflow:hidden;position:absolute;width:50.2%}.katex .halfarrow-right{overflow:hidden;position:absolute;right:0;width:50.2%}.katex .brace-left{left:0;overflow:hidden;position:absolute;width:25.1%}.katex .brace-center{left:25%;overflow:hidden;position:absolute;width:50%}.katex .brace-right{overflow:hidden;position:absolute;right:0;width:25.1%}.katex .x-arrow-pad{padding:0 .5em}.katex .cd-arrow-pad{padding:0 .55556em 0 .27778em}.katex .mover,.katex .munder,.katex .x-arrow{text-align:center}.katex .boxpad{padding:0 .3em}.katex .fbox,.katex .fcolorbox{border:.04em solid;box-sizing:border-box}.katex .cancel-pad{padding:0 .2em}.katex .cancel-lap{margin-left:-.2em;margin-right:-.2em}.katex .sout{border-bottom-style:solid;border-bottom-width:.08em}.katex .angl{border-right:.049em solid;border-top:.049em solid;box-sizing:border-box;margin-right:.03889em}.katex .anglpad{padding:0 .03889em}.katex .eqn-num:before{content:"(" counter(katexEqnNo) ")";counter-increment:katexEqnNo}.katex .mml-eqn-num:before{content:"(" counter(mmlEqnNo) ")";counter-increment:mmlEqnNo}.katex .mtr-glue{width:50%}.katex .cd-vert-arrow{display:inline-block;position:relative}.katex .cd-label-left{display:inline-block;position:absolute;right:calc(50% + .3em);text-align:left}.katex .cd-label-right{display:inline-block;left:calc(50% + .3em);position:absolute;text-align:right}.katex-display{display:block;margin:1em 0;text-align:center}.katex-display>.katex{display:block;text-align:center;white-space:nowrap}.katex-display>.katex>.katex-html{display:block;position:relative}.katex-display>.katex>.katex-html>.tag{position:absolute;right:0}.katex-display.leqno>.katex>.katex-html>.tag{left:0;right:auto}.katex-display.fleqn>.katex{padding-left:2em;text-align:left}body{counter-reset:katexEqnNo mmlEqnNo}

/*
* Remix Icon v4.9.1
* https://remixicon.com
* https://github.com/Remix-Design/RemixIcon
*
* Copyright RemixIcon.com
* Released under the Remix Icon License 1.0
*
* Date: 2026-01-29
*/
@font-face {
  font-family: "remixicon";
  src: url('/remixicon.dce71631.eot?t=1769685282643'); /* IE9*/
  src: url('/remixicon.dce71631.eot?t=1769685282643#iefix') format('embedded-opentype'), 
  url("/remixicon.81fdf44d.woff2?t=1769685282643") format("woff2"),
  url("/remixicon.e229d2db.woff?t=1769685282643") format("woff"),
  url('/remixicon.ea9563a0.ttf?t=1769685282643') format('truetype'), 
  url('/remixicon.fa9ba0bb.svg?t=1769685282643#remixicon') format('svg'); /* iOS 4.1- */
  font-display: swap;
}

[class^="ri-"], [class*=" ri-"] {
  font-family: 'remixicon' !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.ri-lg { font-size: 1.3333em; line-height: 0.75em; vertical-align: -.0667em; }
.ri-xl { font-size: 1.5em; line-height: 0.6666em; vertical-align: -.075em; }
.ri-xxs { font-size: .5em; }
.ri-xs { font-size: .75em; }
.ri-sm { font-size: .875em }
.ri-1x { font-size: 1em; }
.ri-2x { font-size: 2em; }
.ri-3x { font-size: 3em; }
.ri-4x { font-size: 4em; }
.ri-5x { font-size: 5em; }
.ri-6x { font-size: 6em; }
.ri-7x { font-size: 7em; }
.ri-8x { font-size: 8em; }
.ri-9x { font-size: 9em; }
.ri-10x { font-size: 10em; }
.ri-fw { text-align: center; width: 1.25em; }

.ri-24-hours-fill:before { content: "\ea01"; }
.ri-24-hours-line:before { content: "\ea02"; }
.ri-4k-fill:before { content: "\ea03"; }
.ri-4k-line:before { content: "\ea04"; }
.ri-a-b:before { content: "\ea05"; }
.ri-account-box-fill:before { content: "\ea06"; }
.ri-account-box-line:before { content: "\ea07"; }
.ri-account-circle-fill:before { content: "\ea08"; }
.ri-account-circle-line:before { content: "\ea09"; }
.ri-account-pin-box-fill:before { content: "\ea0a"; }
.ri-account-pin-box-line:before { content: "\ea0b"; }
.ri-account-pin-circle-fill:before { content: "\ea0c"; }
.ri-account-pin-circle-line:before { content: "\ea0d"; }
.ri-add-box-fill:before { content: "\ea0e"; }
.ri-add-box-line:before { content: "\ea0f"; }
.ri-add-circle-fill:before { content: "\ea10"; }
.ri-add-circle-line:before { content: "\ea11"; }
.ri-add-fill:before { content: "\ea12"; }
.ri-add-line:before { content: "\ea13"; }
.ri-admin-fill:before { content: "\ea14"; }
.ri-admin-line:before { content: "\ea15"; }
.ri-advertisement-fill:before { content: "\ea16"; }
.ri-advertisement-line:before { content: "\ea17"; }
.ri-airplay-fill:before { content: "\ea18"; }
.ri-airplay-line:before { content: "\ea19"; }
.ri-alarm-fill:before { content: "\ea1a"; }
.ri-alarm-line:before { content: "\ea1b"; }
.ri-alarm-warning-fill:before { content: "\ea1c"; }
.ri-alarm-warning-line:before { content: "\ea1d"; }
.ri-album-fill:before { content: "\ea1e"; }
.ri-album-line:before { content: "\ea1f"; }
.ri-alert-fill:before { content: "\ea20"; }
.ri-alert-line:before { content: "\ea21"; }
.ri-aliens-fill:before { content: "\ea22"; }
.ri-aliens-line:before { content: "\ea23"; }
.ri-align-bottom:before { content: "\ea24"; }
.ri-align-center:before { content: "\ea25"; }
.ri-align-justify:before { content: "\ea26"; }
.ri-align-left:before { content: "\ea27"; }
.ri-align-right:before { content: "\ea28"; }
.ri-align-top:before { content: "\ea29"; }
.ri-align-vertically:before { content: "\ea2a"; }
.ri-alipay-fill:before { content: "\ea2b"; }
.ri-alipay-line:before { content: "\ea2c"; }
.ri-amazon-fill:before { content: "\ea2d"; }
.ri-amazon-line:before { content: "\ea2e"; }
.ri-anchor-fill:before { content: "\ea2f"; }
.ri-anchor-line:before { content: "\ea30"; }
.ri-ancient-gate-fill:before { content: "\ea31"; }
.ri-ancient-gate-line:before { content: "\ea32"; }
.ri-ancient-pavilion-fill:before { content: "\ea33"; }
.ri-ancient-pavilion-line:before { content: "\ea34"; }
.ri-android-fill:before { content: "\ea35"; }
.ri-android-line:before { content: "\ea36"; }
.ri-angularjs-fill:before { content: "\ea37"; }
.ri-angularjs-line:before { content: "\ea38"; }
.ri-anticlockwise-2-fill:before { content: "\ea39"; }
.ri-anticlockwise-2-line:before { content: "\ea3a"; }
.ri-anticlockwise-fill:before { content: "\ea3b"; }
.ri-anticlockwise-line:before { content: "\ea3c"; }
.ri-app-store-fill:before { content: "\ea3d"; }
.ri-app-store-line:before { content: "\ea3e"; }
.ri-apple-fill:before { content: "\ea3f"; }
.ri-apple-line:before { content: "\ea40"; }
.ri-apps-2-fill:before { content: "\ea41"; }
.ri-apps-2-line:before { content: "\ea42"; }
.ri-apps-fill:before { content: "\ea43"; }
.ri-apps-line:before { content: "\ea44"; }
.ri-archive-drawer-fill:before { content: "\ea45"; }
.ri-archive-drawer-line:before { content: "\ea46"; }
.ri-archive-fill:before { content: "\ea47"; }
.ri-archive-line:before { content: "\ea48"; }
.ri-arrow-down-circle-fill:before { content: "\ea49"; }
.ri-arrow-down-circle-line:before { content: "\ea4a"; }
.ri-arrow-down-fill:before { content: "\ea4b"; }
.ri-arrow-down-line:before { content: "\ea4c"; }
.ri-arrow-down-s-fill:before { content: "\ea4d"; }
.ri-arrow-down-s-line:before { content: "\ea4e"; }
.ri-arrow-drop-down-fill:before { content: "\ea4f"; }
.ri-arrow-drop-down-line:before { content: "\ea50"; }
.ri-arrow-drop-left-fill:before { content: "\ea51"; }
.ri-arrow-drop-left-line:before { content: "\ea52"; }
.ri-arrow-drop-right-fill:before { content: "\ea53"; }
.ri-arrow-drop-right-line:before { content: "\ea54"; }
.ri-arrow-drop-up-fill:before { content: "\ea55"; }
.ri-arrow-drop-up-line:before { content: "\ea56"; }
.ri-arrow-go-back-fill:before { content: "\ea57"; }
.ri-arrow-go-back-line:before { content: "\ea58"; }
.ri-arrow-go-forward-fill:before { content: "\ea59"; }
.ri-arrow-go-forward-line:before { content: "\ea5a"; }
.ri-arrow-left-circle-fill:before { content: "\ea5b"; }
.ri-arrow-left-circle-line:before { content: "\ea5c"; }
.ri-arrow-left-down-fill:before { content: "\ea5d"; }
.ri-arrow-left-down-line:before { content: "\ea5e"; }
.ri-arrow-left-fill:before { content: "\ea5f"; }
.ri-arrow-left-line:before { content: "\ea60"; }
.ri-arrow-left-right-fill:before { content: "\ea61"; }
.ri-arrow-left-right-line:before { content: "\ea62"; }
.ri-arrow-left-s-fill:before { content: "\ea63"; }
.ri-arrow-left-s-line:before { content: "\ea64"; }
.ri-arrow-left-up-fill:before { content: "\ea65"; }
.ri-arrow-left-up-line:before { content: "\ea66"; }
.ri-arrow-right-circle-fill:before { content: "\ea67"; }
.ri-arrow-right-circle-line:before { content: "\ea68"; }
.ri-arrow-right-down-fill:before { content: "\ea69"; }
.ri-arrow-right-down-line:before { content: "\ea6a"; }
.ri-arrow-right-fill:before { content: "\ea6b"; }
.ri-arrow-right-line:before { content: "\ea6c"; }
.ri-arrow-right-s-fill:before { content: "\ea6d"; }
.ri-arrow-right-s-line:before { content: "\ea6e"; }
.ri-arrow-right-up-fill:before { content: "\ea6f"; }
.ri-arrow-right-up-line:before { content: "\ea70"; }
.ri-arrow-up-circle-fill:before { content: "\ea71"; }
.ri-arrow-up-circle-line:before { content: "\ea72"; }
.ri-arrow-up-down-fill:before { content: "\ea73"; }
.ri-arrow-up-down-line:before { content: "\ea74"; }
.ri-arrow-up-fill:before { content: "\ea75"; }
.ri-arrow-up-line:before { content: "\ea76"; }
.ri-arrow-up-s-fill:before { content: "\ea77"; }
.ri-arrow-up-s-line:before { content: "\ea78"; }
.ri-artboard-2-fill:before { content: "\ea79"; }
.ri-artboard-2-line:before { content: "\ea7a"; }
.ri-artboard-fill:before { content: "\ea7b"; }
.ri-artboard-line:before { content: "\ea7c"; }
.ri-article-fill:before { content: "\ea7d"; }
.ri-article-line:before { content: "\ea7e"; }
.ri-aspect-ratio-fill:before { content: "\ea7f"; }
.ri-aspect-ratio-line:before { content: "\ea80"; }
.ri-asterisk:before { content: "\ea81"; }
.ri-at-fill:before { content: "\ea82"; }
.ri-at-line:before { content: "\ea83"; }
.ri-attachment-2:before { content: "\ea84"; }
.ri-attachment-fill:before { content: "\ea85"; }
.ri-attachment-line:before { content: "\ea86"; }
.ri-auction-fill:before { content: "\ea87"; }
.ri-auction-line:before { content: "\ea88"; }
.ri-award-fill:before { content: "\ea89"; }
.ri-award-line:before { content: "\ea8a"; }
.ri-baidu-fill:before { content: "\ea8b"; }
.ri-baidu-line:before { content: "\ea8c"; }
.ri-ball-pen-fill:before { content: "\ea8d"; }
.ri-ball-pen-line:before { content: "\ea8e"; }
.ri-bank-card-2-fill:before { content: "\ea8f"; }
.ri-bank-card-2-line:before { content: "\ea90"; }
.ri-bank-card-fill:before { content: "\ea91"; }
.ri-bank-card-line:before { content: "\ea92"; }
.ri-bank-fill:before { content: "\ea93"; }
.ri-bank-line:before { content: "\ea94"; }
.ri-bar-chart-2-fill:before { content: "\ea95"; }
.ri-bar-chart-2-line:before { content: "\ea96"; }
.ri-bar-chart-box-fill:before { content: "\ea97"; }
.ri-bar-chart-box-line:before { content: "\ea98"; }
.ri-bar-chart-fill:before { content: "\ea99"; }
.ri-bar-chart-grouped-fill:before { content: "\ea9a"; }
.ri-bar-chart-grouped-line:before { content: "\ea9b"; }
.ri-bar-chart-horizontal-fill:before { content: "\ea9c"; }
.ri-bar-chart-horizontal-line:before { content: "\ea9d"; }
.ri-bar-chart-line:before { content: "\ea9e"; }
.ri-barcode-box-fill:before { content: "\ea9f"; }
.ri-barcode-box-line:before { content: "\eaa0"; }
.ri-barcode-fill:before { content: "\eaa1"; }
.ri-barcode-line:before { content: "\eaa2"; }
.ri-barricade-fill:before { content: "\eaa3"; }
.ri-barricade-line:before { content: "\eaa4"; }
.ri-base-station-fill:before { content: "\eaa5"; }
.ri-base-station-line:before { content: "\eaa6"; }
.ri-basketball-fill:before { content: "\eaa7"; }
.ri-basketball-line:before { content: "\eaa8"; }
.ri-battery-2-charge-fill:before { content: "\eaa9"; }
.ri-battery-2-charge-line:before { content: "\eaaa"; }
.ri-battery-2-fill:before { content: "\eaab"; }
.ri-battery-2-line:before { content: "\eaac"; }
.ri-battery-charge-fill:before { content: "\eaad"; }
.ri-battery-charge-line:before { content: "\eaae"; }
.ri-battery-fill:before { content: "\eaaf"; }
.ri-battery-line:before { content: "\eab0"; }
.ri-battery-low-fill:before { content: "\eab1"; }
.ri-battery-low-line:before { content: "\eab2"; }
.ri-battery-saver-fill:before { content: "\eab3"; }
.ri-battery-saver-line:before { content: "\eab4"; }
.ri-battery-share-fill:before { content: "\eab5"; }
.ri-battery-share-line:before { content: "\eab6"; }
.ri-bear-smile-fill:before { content: "\eab7"; }
.ri-bear-smile-line:before { content: "\eab8"; }
.ri-behance-fill:before { content: "\eab9"; }
.ri-behance-line:before { content: "\eaba"; }
.ri-bell-fill:before { content: "\eabb"; }
.ri-bell-line:before { content: "\eabc"; }
.ri-bike-fill:before { content: "\eabd"; }
.ri-bike-line:before { content: "\eabe"; }
.ri-bilibili-fill:before { content: "\eabf"; }
.ri-bilibili-line:before { content: "\eac0"; }
.ri-bill-fill:before { content: "\eac1"; }
.ri-bill-line:before { content: "\eac2"; }
.ri-billiards-fill:before { content: "\eac3"; }
.ri-billiards-line:before { content: "\eac4"; }
.ri-bit-coin-fill:before { content: "\eac5"; }
.ri-bit-coin-line:before { content: "\eac6"; }
.ri-blaze-fill:before { content: "\eac7"; }
.ri-blaze-line:before { content: "\eac8"; }
.ri-bluetooth-connect-fill:before { content: "\eac9"; }
.ri-bluetooth-connect-line:before { content: "\eaca"; }
.ri-bluetooth-fill:before { content: "\eacb"; }
.ri-bluetooth-line:before { content: "\eacc"; }
.ri-blur-off-fill:before { content: "\eacd"; }
.ri-blur-off-line:before { content: "\eace"; }
.ri-body-scan-fill:before { content: "\eacf"; }
.ri-body-scan-line:before { content: "\ead0"; }
.ri-bold:before { content: "\ead1"; }
.ri-book-2-fill:before { content: "\ead2"; }
.ri-book-2-line:before { content: "\ead3"; }
.ri-book-3-fill:before { content: "\ead4"; }
.ri-book-3-line:before { content: "\ead5"; }
.ri-book-fill:before { content: "\ead6"; }
.ri-book-line:before { content: "\ead7"; }
.ri-book-marked-fill:before { content: "\ead8"; }
.ri-book-marked-line:before { content: "\ead9"; }
.ri-book-open-fill:before { content: "\eada"; }
.ri-book-open-line:before { content: "\eadb"; }
.ri-book-read-fill:before { content: "\eadc"; }
.ri-book-read-line:before { content: "\eadd"; }
.ri-booklet-fill:before { content: "\eade"; }
.ri-booklet-line:before { content: "\eadf"; }
.ri-bookmark-2-fill:before { content: "\eae0"; }
.ri-bookmark-2-line:before { content: "\eae1"; }
.ri-bookmark-3-fill:before { content: "\eae2"; }
.ri-bookmark-3-line:before { content: "\eae3"; }
.ri-bookmark-fill:before { content: "\eae4"; }
.ri-bookmark-line:before { content: "\eae5"; }
.ri-boxing-fill:before { content: "\eae6"; }
.ri-boxing-line:before { content: "\eae7"; }
.ri-braces-fill:before { content: "\eae8"; }
.ri-braces-line:before { content: "\eae9"; }
.ri-brackets-fill:before { content: "\eaea"; }
.ri-brackets-line:before { content: "\eaeb"; }
.ri-briefcase-2-fill:before { content: "\eaec"; }
.ri-briefcase-2-line:before { content: "\eaed"; }
.ri-briefcase-3-fill:before { content: "\eaee"; }
.ri-briefcase-3-line:before { content: "\eaef"; }
.ri-briefcase-4-fill:before { content: "\eaf0"; }
.ri-briefcase-4-line:before { content: "\eaf1"; }
.ri-briefcase-5-fill:before { content: "\eaf2"; }
.ri-briefcase-5-line:before { content: "\eaf3"; }
.ri-briefcase-fill:before { content: "\eaf4"; }
.ri-briefcase-line:before { content: "\eaf5"; }
.ri-bring-forward:before { content: "\eaf6"; }
.ri-bring-to-front:before { content: "\eaf7"; }
.ri-broadcast-fill:before { content: "\eaf8"; }
.ri-broadcast-line:before { content: "\eaf9"; }
.ri-brush-2-fill:before { content: "\eafa"; }
.ri-brush-2-line:before { content: "\eafb"; }
.ri-brush-3-fill:before { content: "\eafc"; }
.ri-brush-3-line:before { content: "\eafd"; }
.ri-brush-4-fill:before { content: "\eafe"; }
.ri-brush-4-line:before { content: "\eaff"; }
.ri-brush-fill:before { content: "\eb00"; }
.ri-brush-line:before { content: "\eb01"; }
.ri-bubble-chart-fill:before { content: "\eb02"; }
.ri-bubble-chart-line:before { content: "\eb03"; }
.ri-bug-2-fill:before { content: "\eb04"; }
.ri-bug-2-line:before { content: "\eb05"; }
.ri-bug-fill:before { content: "\eb06"; }
.ri-bug-line:before { content: "\eb07"; }
.ri-building-2-fill:before { content: "\eb08"; }
.ri-building-2-line:before { content: "\eb09"; }
.ri-building-3-fill:before { content: "\eb0a"; }
.ri-building-3-line:before { content: "\eb0b"; }
.ri-building-4-fill:before { content: "\eb0c"; }
.ri-building-4-line:before { content: "\eb0d"; }
.ri-building-fill:before { content: "\eb0e"; }
.ri-building-line:before { content: "\eb0f"; }
.ri-bus-2-fill:before { content: "\eb10"; }
.ri-bus-2-line:before { content: "\eb11"; }
.ri-bus-fill:before { content: "\eb12"; }
.ri-bus-line:before { content: "\eb13"; }
.ri-bus-wifi-fill:before { content: "\eb14"; }
.ri-bus-wifi-line:before { content: "\eb15"; }
.ri-cactus-fill:before { content: "\eb16"; }
.ri-cactus-line:before { content: "\eb17"; }
.ri-cake-2-fill:before { content: "\eb18"; }
.ri-cake-2-line:before { content: "\eb19"; }
.ri-cake-3-fill:before { content: "\eb1a"; }
.ri-cake-3-line:before { content: "\eb1b"; }
.ri-cake-fill:before { content: "\eb1c"; }
.ri-cake-line:before { content: "\eb1d"; }
.ri-calculator-fill:before { content: "\eb1e"; }
.ri-calculator-line:before { content: "\eb1f"; }
.ri-calendar-2-fill:before { content: "\eb20"; }
.ri-calendar-2-line:before { content: "\eb21"; }
.ri-calendar-check-fill:before { content: "\eb22"; }
.ri-calendar-check-line:before { content: "\eb23"; }
.ri-calendar-event-fill:before { content: "\eb24"; }
.ri-calendar-event-line:before { content: "\eb25"; }
.ri-calendar-fill:before { content: "\eb26"; }
.ri-calendar-line:before { content: "\eb27"; }
.ri-calendar-todo-fill:before { content: "\eb28"; }
.ri-calendar-todo-line:before { content: "\eb29"; }
.ri-camera-2-fill:before { content: "\eb2a"; }
.ri-camera-2-line:before { content: "\eb2b"; }
.ri-camera-3-fill:before { content: "\eb2c"; }
.ri-camera-3-line:before { content: "\eb2d"; }
.ri-camera-fill:before { content: "\eb2e"; }
.ri-camera-lens-fill:before { content: "\eb2f"; }
.ri-camera-lens-line:before { content: "\eb30"; }
.ri-camera-line:before { content: "\eb31"; }
.ri-camera-off-fill:before { content: "\eb32"; }
.ri-camera-off-line:before { content: "\eb33"; }
.ri-camera-switch-fill:before { content: "\eb34"; }
.ri-camera-switch-line:before { content: "\eb35"; }
.ri-capsule-fill:before { content: "\eb36"; }
.ri-capsule-line:before { content: "\eb37"; }
.ri-car-fill:before { content: "\eb38"; }
.ri-car-line:before { content: "\eb39"; }
.ri-car-washing-fill:before { content: "\eb3a"; }
.ri-car-washing-line:before { content: "\eb3b"; }
.ri-caravan-fill:before { content: "\eb3c"; }
.ri-caravan-line:before { content: "\eb3d"; }
.ri-cast-fill:before { content: "\eb3e"; }
.ri-cast-line:before { content: "\eb3f"; }
.ri-cellphone-fill:before { content: "\eb40"; }
.ri-cellphone-line:before { content: "\eb41"; }
.ri-celsius-fill:before { content: "\eb42"; }
.ri-celsius-line:before { content: "\eb43"; }
.ri-centos-fill:before { content: "\eb44"; }
.ri-centos-line:before { content: "\eb45"; }
.ri-character-recognition-fill:before { content: "\eb46"; }
.ri-character-recognition-line:before { content: "\eb47"; }
.ri-charging-pile-2-fill:before { content: "\eb48"; }
.ri-charging-pile-2-line:before { content: "\eb49"; }
.ri-charging-pile-fill:before { content: "\eb4a"; }
.ri-charging-pile-line:before { content: "\eb4b"; }
.ri-chat-1-fill:before { content: "\eb4c"; }
.ri-chat-1-line:before { content: "\eb4d"; }
.ri-chat-2-fill:before { content: "\eb4e"; }
.ri-chat-2-line:before { content: "\eb4f"; }
.ri-chat-3-fill:before { content: "\eb50"; }
.ri-chat-3-line:before { content: "\eb51"; }
.ri-chat-4-fill:before { content: "\eb52"; }
.ri-chat-4-line:before { content: "\eb53"; }
.ri-chat-check-fill:before { content: "\eb54"; }
.ri-chat-check-line:before { content: "\eb55"; }
.ri-chat-delete-fill:before { content: "\eb56"; }
.ri-chat-delete-line:before { content: "\eb57"; }
.ri-chat-download-fill:before { content: "\eb58"; }
.ri-chat-download-line:before { content: "\eb59"; }
.ri-chat-follow-up-fill:before { content: "\eb5a"; }
.ri-chat-follow-up-line:before { content: "\eb5b"; }
.ri-chat-forward-fill:before { content: "\eb5c"; }
.ri-chat-forward-line:before { content: "\eb5d"; }
.ri-chat-heart-fill:before { content: "\eb5e"; }
.ri-chat-heart-line:before { content: "\eb5f"; }
.ri-chat-history-fill:before { content: "\eb60"; }
.ri-chat-history-line:before { content: "\eb61"; }
.ri-chat-new-fill:before { content: "\eb62"; }
.ri-chat-new-line:before { content: "\eb63"; }
.ri-chat-off-fill:before { content: "\eb64"; }
.ri-chat-off-line:before { content: "\eb65"; }
.ri-chat-poll-fill:before { content: "\eb66"; }
.ri-chat-poll-line:before { content: "\eb67"; }
.ri-chat-private-fill:before { content: "\eb68"; }
.ri-chat-private-line:before { content: "\eb69"; }
.ri-chat-quote-fill:before { content: "\eb6a"; }
.ri-chat-quote-line:before { content: "\eb6b"; }
.ri-chat-settings-fill:before { content: "\eb6c"; }
.ri-chat-settings-line:before { content: "\eb6d"; }
.ri-chat-smile-2-fill:before { content: "\eb6e"; }
.ri-chat-smile-2-line:before { content: "\eb6f"; }
.ri-chat-smile-3-fill:before { content: "\eb70"; }
.ri-chat-smile-3-line:before { content: "\eb71"; }
.ri-chat-smile-fill:before { content: "\eb72"; }
.ri-chat-smile-line:before { content: "\eb73"; }
.ri-chat-upload-fill:before { content: "\eb74"; }
.ri-chat-upload-line:before { content: "\eb75"; }
.ri-chat-voice-fill:before { content: "\eb76"; }
.ri-chat-voice-line:before { content: "\eb77"; }
.ri-check-double-fill:before { content: "\eb78"; }
.ri-check-double-line:before { content: "\eb79"; }
.ri-check-fill:before { content: "\eb7a"; }
.ri-check-line:before { content: "\eb7b"; }
.ri-checkbox-blank-circle-fill:before { content: "\eb7c"; }
.ri-checkbox-blank-circle-line:before { content: "\eb7d"; }
.ri-checkbox-blank-fill:before { content: "\eb7e"; }
.ri-checkbox-blank-line:before { content: "\eb7f"; }
.ri-checkbox-circle-fill:before { content: "\eb80"; }
.ri-checkbox-circle-line:before { content: "\eb81"; }
.ri-checkbox-fill:before { content: "\eb82"; }
.ri-checkbox-indeterminate-fill:before { content: "\eb83"; }
.ri-checkbox-indeterminate-line:before { content: "\eb84"; }
.ri-checkbox-line:before { content: "\eb85"; }
.ri-checkbox-multiple-blank-fill:before { content: "\eb86"; }
.ri-checkbox-multiple-blank-line:before { content: "\eb87"; }
.ri-checkbox-multiple-fill:before { content: "\eb88"; }
.ri-checkbox-multiple-line:before { content: "\eb89"; }
.ri-china-railway-fill:before { content: "\eb8a"; }
.ri-china-railway-line:before { content: "\eb8b"; }
.ri-chrome-fill:before { content: "\eb8c"; }
.ri-chrome-line:before { content: "\eb8d"; }
.ri-clapperboard-fill:before { content: "\eb8e"; }
.ri-clapperboard-line:before { content: "\eb8f"; }
.ri-clipboard-fill:before { content: "\eb90"; }
.ri-clipboard-line:before { content: "\eb91"; }
.ri-clockwise-2-fill:before { content: "\eb92"; }
.ri-clockwise-2-line:before { content: "\eb93"; }
.ri-clockwise-fill:before { content: "\eb94"; }
.ri-clockwise-line:before { content: "\eb95"; }
.ri-close-circle-fill:before { content: "\eb96"; }
.ri-close-circle-line:before { content: "\eb97"; }
.ri-close-fill:before { content: "\eb98"; }
.ri-close-line:before { content: "\eb99"; }
.ri-closed-captioning-fill:before { content: "\eb9a"; }
.ri-closed-captioning-line:before { content: "\eb9b"; }
.ri-cloud-fill:before { content: "\eb9c"; }
.ri-cloud-line:before { content: "\eb9d"; }
.ri-cloud-off-fill:before { content: "\eb9e"; }
.ri-cloud-off-line:before { content: "\eb9f"; }
.ri-cloud-windy-fill:before { content: "\eba0"; }
.ri-cloud-windy-line:before { content: "\eba1"; }
.ri-cloudy-2-fill:before { content: "\eba2"; }
.ri-cloudy-2-line:before { content: "\eba3"; }
.ri-cloudy-fill:before { content: "\eba4"; }
.ri-cloudy-line:before { content: "\eba5"; }
.ri-code-box-fill:before { content: "\eba6"; }
.ri-code-box-line:before { content: "\eba7"; }
.ri-code-fill:before { content: "\eba8"; }
.ri-code-line:before { content: "\eba9"; }
.ri-code-s-fill:before { content: "\ebaa"; }
.ri-code-s-line:before { content: "\ebab"; }
.ri-code-s-slash-fill:before { content: "\ebac"; }
.ri-code-s-slash-line:before { content: "\ebad"; }
.ri-code-view:before { content: "\ebae"; }
.ri-codepen-fill:before { content: "\ebaf"; }
.ri-codepen-line:before { content: "\ebb0"; }
.ri-coin-fill:before { content: "\ebb1"; }
.ri-coin-line:before { content: "\ebb2"; }
.ri-coins-fill:before { content: "\ebb3"; }
.ri-coins-line:before { content: "\ebb4"; }
.ri-collage-fill:before { content: "\ebb5"; }
.ri-collage-line:before { content: "\ebb6"; }
.ri-command-fill:before { content: "\ebb7"; }
.ri-command-line:before { content: "\ebb8"; }
.ri-community-fill:before { content: "\ebb9"; }
.ri-community-line:before { content: "\ebba"; }
.ri-compass-2-fill:before { content: "\ebbb"; }
.ri-compass-2-line:before { content: "\ebbc"; }
.ri-compass-3-fill:before { content: "\ebbd"; }
.ri-compass-3-line:before { content: "\ebbe"; }
.ri-compass-4-fill:before { content: "\ebbf"; }
.ri-compass-4-line:before { content: "\ebc0"; }
.ri-compass-discover-fill:before { content: "\ebc1"; }
.ri-compass-discover-line:before { content: "\ebc2"; }
.ri-compass-fill:before { content: "\ebc3"; }
.ri-compass-line:before { content: "\ebc4"; }
.ri-compasses-2-fill:before { content: "\ebc5"; }
.ri-compasses-2-line:before { content: "\ebc6"; }
.ri-compasses-fill:before { content: "\ebc7"; }
.ri-compasses-line:before { content: "\ebc8"; }
.ri-computer-fill:before { content: "\ebc9"; }
.ri-computer-line:before { content: "\ebca"; }
.ri-contacts-book-2-fill:before { content: "\ebcb"; }
.ri-contacts-book-2-line:before { content: "\ebcc"; }
.ri-contacts-book-fill:before { content: "\ebcd"; }
.ri-contacts-book-line:before { content: "\ebce"; }
.ri-contacts-book-upload-fill:before { content: "\ebcf"; }
.ri-contacts-book-upload-line:before { content: "\ebd0"; }
.ri-contacts-fill:before { content: "\ebd1"; }
.ri-contacts-line:before { content: "\ebd2"; }
.ri-contrast-2-fill:before { content: "\ebd3"; }
.ri-contrast-2-line:before { content: "\ebd4"; }
.ri-contrast-drop-2-fill:before { content: "\ebd5"; }
.ri-contrast-drop-2-line:before { content: "\ebd6"; }
.ri-contrast-drop-fill:before { content: "\ebd7"; }
.ri-contrast-drop-line:before { content: "\ebd8"; }
.ri-contrast-fill:before { content: "\ebd9"; }
.ri-contrast-line:before { content: "\ebda"; }
.ri-copper-coin-fill:before { content: "\ebdb"; }
.ri-copper-coin-line:before { content: "\ebdc"; }
.ri-copper-diamond-fill:before { content: "\ebdd"; }
.ri-copper-diamond-line:before { content: "\ebde"; }
.ri-copyleft-fill:before { content: "\ebdf"; }
.ri-copyleft-line:before { content: "\ebe0"; }
.ri-copyright-fill:before { content: "\ebe1"; }
.ri-copyright-line:before { content: "\ebe2"; }
.ri-coreos-fill:before { content: "\ebe3"; }
.ri-coreos-line:before { content: "\ebe4"; }
.ri-coupon-2-fill:before { content: "\ebe5"; }
.ri-coupon-2-line:before { content: "\ebe6"; }
.ri-coupon-3-fill:before { content: "\ebe7"; }
.ri-coupon-3-line:before { content: "\ebe8"; }
.ri-coupon-4-fill:before { content: "\ebe9"; }
.ri-coupon-4-line:before { content: "\ebea"; }
.ri-coupon-5-fill:before { content: "\ebeb"; }
.ri-coupon-5-line:before { content: "\ebec"; }
.ri-coupon-fill:before { content: "\ebed"; }
.ri-coupon-line:before { content: "\ebee"; }
.ri-cpu-fill:before { content: "\ebef"; }
.ri-cpu-line:before { content: "\ebf0"; }
.ri-creative-commons-by-fill:before { content: "\ebf1"; }
.ri-creative-commons-by-line:before { content: "\ebf2"; }
.ri-creative-commons-fill:before { content: "\ebf3"; }
.ri-creative-commons-line:before { content: "\ebf4"; }
.ri-creative-commons-nc-fill:before { content: "\ebf5"; }
.ri-creative-commons-nc-line:before { content: "\ebf6"; }
.ri-creative-commons-nd-fill:before { content: "\ebf7"; }
.ri-creative-commons-nd-line:before { content: "\ebf8"; }
.ri-creative-commons-sa-fill:before { content: "\ebf9"; }
.ri-creative-commons-sa-line:before { content: "\ebfa"; }
.ri-creative-commons-zero-fill:before { content: "\ebfb"; }
.ri-creative-commons-zero-line:before { content: "\ebfc"; }
.ri-criminal-fill:before { content: "\ebfd"; }
.ri-criminal-line:before { content: "\ebfe"; }
.ri-crop-2-fill:before { content: "\ebff"; }
.ri-crop-2-line:before { content: "\ec00"; }
.ri-crop-fill:before { content: "\ec01"; }
.ri-crop-line:before { content: "\ec02"; }
.ri-css3-fill:before { content: "\ec03"; }
.ri-css3-line:before { content: "\ec04"; }
.ri-cup-fill:before { content: "\ec05"; }
.ri-cup-line:before { content: "\ec06"; }
.ri-currency-fill:before { content: "\ec07"; }
.ri-currency-line:before { content: "\ec08"; }
.ri-cursor-fill:before { content: "\ec09"; }
.ri-cursor-line:before { content: "\ec0a"; }
.ri-customer-service-2-fill:before { content: "\ec0b"; }
.ri-customer-service-2-line:before { content: "\ec0c"; }
.ri-customer-service-fill:before { content: "\ec0d"; }
.ri-customer-service-line:before { content: "\ec0e"; }
.ri-dashboard-2-fill:before { content: "\ec0f"; }
.ri-dashboard-2-line:before { content: "\ec10"; }
.ri-dashboard-3-fill:before { content: "\ec11"; }
.ri-dashboard-3-line:before { content: "\ec12"; }
.ri-dashboard-fill:before { content: "\ec13"; }
.ri-dashboard-line:before { content: "\ec14"; }
.ri-database-2-fill:before { content: "\ec15"; }
.ri-database-2-line:before { content: "\ec16"; }
.ri-database-fill:before { content: "\ec17"; }
.ri-database-line:before { content: "\ec18"; }
.ri-delete-back-2-fill:before { content: "\ec19"; }
.ri-delete-back-2-line:before { content: "\ec1a"; }
.ri-delete-back-fill:before { content: "\ec1b"; }
.ri-delete-back-line:before { content: "\ec1c"; }
.ri-delete-bin-2-fill:before { content: "\ec1d"; }
.ri-delete-bin-2-line:before { content: "\ec1e"; }
.ri-delete-bin-3-fill:before { content: "\ec1f"; }
.ri-delete-bin-3-line:before { content: "\ec20"; }
.ri-delete-bin-4-fill:before { content: "\ec21"; }
.ri-delete-bin-4-line:before { content: "\ec22"; }
.ri-delete-bin-5-fill:before { content: "\ec23"; }
.ri-delete-bin-5-line:before { content: "\ec24"; }
.ri-delete-bin-6-fill:before { content: "\ec25"; }
.ri-delete-bin-6-line:before { content: "\ec26"; }
.ri-delete-bin-7-fill:before { content: "\ec27"; }
.ri-delete-bin-7-line:before { content: "\ec28"; }
.ri-delete-bin-fill:before { content: "\ec29"; }
.ri-delete-bin-line:before { content: "\ec2a"; }
.ri-delete-column:before { content: "\ec2b"; }
.ri-delete-row:before { content: "\ec2c"; }
.ri-device-fill:before { content: "\ec2d"; }
.ri-device-line:before { content: "\ec2e"; }
.ri-device-recover-fill:before { content: "\ec2f"; }
.ri-device-recover-line:before { content: "\ec30"; }
.ri-dingding-fill:before { content: "\ec31"; }
.ri-dingding-line:before { content: "\ec32"; }
.ri-direction-fill:before { content: "\ec33"; }
.ri-direction-line:before { content: "\ec34"; }
.ri-disc-fill:before { content: "\ec35"; }
.ri-disc-line:before { content: "\ec36"; }
.ri-discord-fill:before { content: "\ec37"; }
.ri-discord-line:before { content: "\ec38"; }
.ri-discuss-fill:before { content: "\ec39"; }
.ri-discuss-line:before { content: "\ec3a"; }
.ri-dislike-fill:before { content: "\ec3b"; }
.ri-dislike-line:before { content: "\ec3c"; }
.ri-disqus-fill:before { content: "\ec3d"; }
.ri-disqus-line:before { content: "\ec3e"; }
.ri-divide-fill:before { content: "\ec3f"; }
.ri-divide-line:before { content: "\ec40"; }
.ri-donut-chart-fill:before { content: "\ec41"; }
.ri-donut-chart-line:before { content: "\ec42"; }
.ri-door-closed-fill:before { content: "\ec43"; }
.ri-door-closed-line:before { content: "\ec44"; }
.ri-door-fill:before { content: "\ec45"; }
.ri-door-line:before { content: "\ec46"; }
.ri-door-lock-box-fill:before { content: "\ec47"; }
.ri-door-lock-box-line:before { content: "\ec48"; }
.ri-door-lock-fill:before { content: "\ec49"; }
.ri-door-lock-line:before { content: "\ec4a"; }
.ri-door-open-fill:before { content: "\ec4b"; }
.ri-door-open-line:before { content: "\ec4c"; }
.ri-dossier-fill:before { content: "\ec4d"; }
.ri-dossier-line:before { content: "\ec4e"; }
.ri-douban-fill:before { content: "\ec4f"; }
.ri-douban-line:before { content: "\ec50"; }
.ri-double-quotes-l:before { content: "\ec51"; }
.ri-double-quotes-r:before { content: "\ec52"; }
.ri-download-2-fill:before { content: "\ec53"; }
.ri-download-2-line:before { content: "\ec54"; }
.ri-download-cloud-2-fill:before { content: "\ec55"; }
.ri-download-cloud-2-line:before { content: "\ec56"; }
.ri-download-cloud-fill:before { content: "\ec57"; }
.ri-download-cloud-line:before { content: "\ec58"; }
.ri-download-fill:before { content: "\ec59"; }
.ri-download-line:before { content: "\ec5a"; }
.ri-draft-fill:before { content: "\ec5b"; }
.ri-draft-line:before { content: "\ec5c"; }
.ri-drag-drop-fill:before { content: "\ec5d"; }
.ri-drag-drop-line:before { content: "\ec5e"; }
.ri-drag-move-2-fill:before { content: "\ec5f"; }
.ri-drag-move-2-line:before { content: "\ec60"; }
.ri-drag-move-fill:before { content: "\ec61"; }
.ri-drag-move-line:before { content: "\ec62"; }
.ri-dribbble-fill:before { content: "\ec63"; }
.ri-dribbble-line:before { content: "\ec64"; }
.ri-drive-fill:before { content: "\ec65"; }
.ri-drive-line:before { content: "\ec66"; }
.ri-drizzle-fill:before { content: "\ec67"; }
.ri-drizzle-line:before { content: "\ec68"; }
.ri-drop-fill:before { content: "\ec69"; }
.ri-drop-line:before { content: "\ec6a"; }
.ri-dropbox-fill:before { content: "\ec6b"; }
.ri-dropbox-line:before { content: "\ec6c"; }
.ri-dual-sim-1-fill:before { content: "\ec6d"; }
.ri-dual-sim-1-line:before { content: "\ec6e"; }
.ri-dual-sim-2-fill:before { content: "\ec6f"; }
.ri-dual-sim-2-line:before { content: "\ec70"; }
.ri-dv-fill:before { content: "\ec71"; }
.ri-dv-line:before { content: "\ec72"; }
.ri-dvd-fill:before { content: "\ec73"; }
.ri-dvd-line:before { content: "\ec74"; }
.ri-e-bike-2-fill:before { content: "\ec75"; }
.ri-e-bike-2-line:before { content: "\ec76"; }
.ri-e-bike-fill:before { content: "\ec77"; }
.ri-e-bike-line:before { content: "\ec78"; }
.ri-earth-fill:before { content: "\ec79"; }
.ri-earth-line:before { content: "\ec7a"; }
.ri-earthquake-fill:before { content: "\ec7b"; }
.ri-earthquake-line:before { content: "\ec7c"; }
.ri-edge-fill:before { content: "\ec7d"; }
.ri-edge-line:before { content: "\ec7e"; }
.ri-edit-2-fill:before { content: "\ec7f"; }
.ri-edit-2-line:before { content: "\ec80"; }
.ri-edit-box-fill:before { content: "\ec81"; }
.ri-edit-box-line:before { content: "\ec82"; }
.ri-edit-circle-fill:before { content: "\ec83"; }
.ri-edit-circle-line:before { content: "\ec84"; }
.ri-edit-fill:before { content: "\ec85"; }
.ri-edit-line:before { content: "\ec86"; }
.ri-eject-fill:before { content: "\ec87"; }
.ri-eject-line:before { content: "\ec88"; }
.ri-emotion-2-fill:before { content: "\ec89"; }
.ri-emotion-2-line:before { content: "\ec8a"; }
.ri-emotion-fill:before { content: "\ec8b"; }
.ri-emotion-happy-fill:before { content: "\ec8c"; }
.ri-emotion-happy-line:before { content: "\ec8d"; }
.ri-emotion-laugh-fill:before { content: "\ec8e"; }
.ri-emotion-laugh-line:before { content: "\ec8f"; }
.ri-emotion-line:before { content: "\ec90"; }
.ri-emotion-normal-fill:before { content: "\ec91"; }
.ri-emotion-normal-line:before { content: "\ec92"; }
.ri-emotion-sad-fill:before { content: "\ec93"; }
.ri-emotion-sad-line:before { content: "\ec94"; }
.ri-emotion-unhappy-fill:before { content: "\ec95"; }
.ri-emotion-unhappy-line:before { content: "\ec96"; }
.ri-empathize-fill:before { content: "\ec97"; }
.ri-empathize-line:before { content: "\ec98"; }
.ri-emphasis-cn:before { content: "\ec99"; }
.ri-emphasis:before { content: "\ec9a"; }
.ri-english-input:before { content: "\ec9b"; }
.ri-equalizer-fill:before { content: "\ec9c"; }
.ri-equalizer-line:before { content: "\ec9d"; }
.ri-eraser-fill:before { content: "\ec9e"; }
.ri-eraser-line:before { content: "\ec9f"; }
.ri-error-warning-fill:before { content: "\eca0"; }
.ri-error-warning-line:before { content: "\eca1"; }
.ri-evernote-fill:before { content: "\eca2"; }
.ri-evernote-line:before { content: "\eca3"; }
.ri-exchange-box-fill:before { content: "\eca4"; }
.ri-exchange-box-line:before { content: "\eca5"; }
.ri-exchange-cny-fill:before { content: "\eca6"; }
.ri-exchange-cny-line:before { content: "\eca7"; }
.ri-exchange-dollar-fill:before { content: "\eca8"; }
.ri-exchange-dollar-line:before { content: "\eca9"; }
.ri-exchange-fill:before { content: "\ecaa"; }
.ri-exchange-funds-fill:before { content: "\ecab"; }
.ri-exchange-funds-line:before { content: "\ecac"; }
.ri-exchange-line:before { content: "\ecad"; }
.ri-external-link-fill:before { content: "\ecae"; }
.ri-external-link-line:before { content: "\ecaf"; }
.ri-eye-2-fill:before { content: "\ecb0"; }
.ri-eye-2-line:before { content: "\ecb1"; }
.ri-eye-close-fill:before { content: "\ecb2"; }
.ri-eye-close-line:before { content: "\ecb3"; }
.ri-eye-fill:before { content: "\ecb4"; }
.ri-eye-line:before { content: "\ecb5"; }
.ri-eye-off-fill:before { content: "\ecb6"; }
.ri-eye-off-line:before { content: "\ecb7"; }
.ri-facebook-box-fill:before { content: "\ecb8"; }
.ri-facebook-box-line:before { content: "\ecb9"; }
.ri-facebook-circle-fill:before { content: "\ecba"; }
.ri-facebook-circle-line:before { content: "\ecbb"; }
.ri-facebook-fill:before { content: "\ecbc"; }
.ri-facebook-line:before { content: "\ecbd"; }
.ri-fahrenheit-fill:before { content: "\ecbe"; }
.ri-fahrenheit-line:before { content: "\ecbf"; }
.ri-feedback-fill:before { content: "\ecc0"; }
.ri-feedback-line:before { content: "\ecc1"; }
.ri-file-2-fill:before { content: "\ecc2"; }
.ri-file-2-line:before { content: "\ecc3"; }
.ri-file-3-fill:before { content: "\ecc4"; }
.ri-file-3-line:before { content: "\ecc5"; }
.ri-file-4-fill:before { content: "\ecc6"; }
.ri-file-4-line:before { content: "\ecc7"; }
.ri-file-add-fill:before { content: "\ecc8"; }
.ri-file-add-line:before { content: "\ecc9"; }
.ri-file-chart-2-fill:before { content: "\ecca"; }
.ri-file-chart-2-line:before { content: "\eccb"; }
.ri-file-chart-fill:before { content: "\eccc"; }
.ri-file-chart-line:before { content: "\eccd"; }
.ri-file-cloud-fill:before { content: "\ecce"; }
.ri-file-cloud-line:before { content: "\eccf"; }
.ri-file-code-fill:before { content: "\ecd0"; }
.ri-file-code-line:before { content: "\ecd1"; }
.ri-file-copy-2-fill:before { content: "\ecd2"; }
.ri-file-copy-2-line:before { content: "\ecd3"; }
.ri-file-copy-fill:before { content: "\ecd4"; }
.ri-file-copy-line:before { content: "\ecd5"; }
.ri-file-damage-fill:before { content: "\ecd6"; }
.ri-file-damage-line:before { content: "\ecd7"; }
.ri-file-download-fill:before { content: "\ecd8"; }
.ri-file-download-line:before { content: "\ecd9"; }
.ri-file-edit-fill:before { content: "\ecda"; }
.ri-file-edit-line:before { content: "\ecdb"; }
.ri-file-excel-2-fill:before { content: "\ecdc"; }
.ri-file-excel-2-line:before { content: "\ecdd"; }
.ri-file-excel-fill:before { content: "\ecde"; }
.ri-file-excel-line:before { content: "\ecdf"; }
.ri-file-fill:before { content: "\ece0"; }
.ri-file-forbid-fill:before { content: "\ece1"; }
.ri-file-forbid-line:before { content: "\ece2"; }
.ri-file-gif-fill:before { content: "\ece3"; }
.ri-file-gif-line:before { content: "\ece4"; }
.ri-file-history-fill:before { content: "\ece5"; }
.ri-file-history-line:before { content: "\ece6"; }
.ri-file-hwp-fill:before { content: "\ece7"; }
.ri-file-hwp-line:before { content: "\ece8"; }
.ri-file-info-fill:before { content: "\ece9"; }
.ri-file-info-line:before { content: "\ecea"; }
.ri-file-line:before { content: "\eceb"; }
.ri-file-list-2-fill:before { content: "\ecec"; }
.ri-file-list-2-line:before { content: "\eced"; }
.ri-file-list-3-fill:before { content: "\ecee"; }
.ri-file-list-3-line:before { content: "\ecef"; }
.ri-file-list-fill:before { content: "\ecf0"; }
.ri-file-list-line:before { content: "\ecf1"; }
.ri-file-lock-fill:before { content: "\ecf2"; }
.ri-file-lock-line:before { content: "\ecf3"; }
.ri-file-marked-fill:before { content: "\ecf4"; }
.ri-file-marked-line:before { content: "\ecf5"; }
.ri-file-music-fill:before { content: "\ecf6"; }
.ri-file-music-line:before { content: "\ecf7"; }
.ri-file-paper-2-fill:before { content: "\ecf8"; }
.ri-file-paper-2-line:before { content: "\ecf9"; }
.ri-file-paper-fill:before { content: "\ecfa"; }
.ri-file-paper-line:before { content: "\ecfb"; }
.ri-file-pdf-fill:before { content: "\ecfc"; }
.ri-file-pdf-line:before { content: "\ecfd"; }
.ri-file-ppt-2-fill:before { content: "\ecfe"; }
.ri-file-ppt-2-line:before { content: "\ecff"; }
.ri-file-ppt-fill:before { content: "\ed00"; }
.ri-file-ppt-line:before { content: "\ed01"; }
.ri-file-reduce-fill:before { content: "\ed02"; }
.ri-file-reduce-line:before { content: "\ed03"; }
.ri-file-search-fill:before { content: "\ed04"; }
.ri-file-search-line:before { content: "\ed05"; }
.ri-file-settings-fill:before { content: "\ed06"; }
.ri-file-settings-line:before { content: "\ed07"; }
.ri-file-shield-2-fill:before { content: "\ed08"; }
.ri-file-shield-2-line:before { content: "\ed09"; }
.ri-file-shield-fill:before { content: "\ed0a"; }
.ri-file-shield-line:before { content: "\ed0b"; }
.ri-file-shred-fill:before { content: "\ed0c"; }
.ri-file-shred-line:before { content: "\ed0d"; }
.ri-file-text-fill:before { content: "\ed0e"; }
.ri-file-text-line:before { content: "\ed0f"; }
.ri-file-transfer-fill:before { content: "\ed10"; }
.ri-file-transfer-line:before { content: "\ed11"; }
.ri-file-unknow-fill:before { content: "\ed12"; }
.ri-file-unknow-line:before { content: "\ed13"; }
.ri-file-upload-fill:before { content: "\ed14"; }
.ri-file-upload-line:before { content: "\ed15"; }
.ri-file-user-fill:before { content: "\ed16"; }
.ri-file-user-line:before { content: "\ed17"; }
.ri-file-warning-fill:before { content: "\ed18"; }
.ri-file-warning-line:before { content: "\ed19"; }
.ri-file-word-2-fill:before { content: "\ed1a"; }
.ri-file-word-2-line:before { content: "\ed1b"; }
.ri-file-word-fill:before { content: "\ed1c"; }
.ri-file-word-line:before { content: "\ed1d"; }
.ri-file-zip-fill:before { content: "\ed1e"; }
.ri-file-zip-line:before { content: "\ed1f"; }
.ri-film-fill:before { content: "\ed20"; }
.ri-film-line:before { content: "\ed21"; }
.ri-filter-2-fill:before { content: "\ed22"; }
.ri-filter-2-line:before { content: "\ed23"; }
.ri-filter-3-fill:before { content: "\ed24"; }
.ri-filter-3-line:before { content: "\ed25"; }
.ri-filter-fill:before { content: "\ed26"; }
.ri-filter-line:before { content: "\ed27"; }
.ri-filter-off-fill:before { content: "\ed28"; }
.ri-filter-off-line:before { content: "\ed29"; }
.ri-find-replace-fill:before { content: "\ed2a"; }
.ri-find-replace-line:before { content: "\ed2b"; }
.ri-finder-fill:before { content: "\ed2c"; }
.ri-finder-line:before { content: "\ed2d"; }
.ri-fingerprint-2-fill:before { content: "\ed2e"; }
.ri-fingerprint-2-line:before { content: "\ed2f"; }
.ri-fingerprint-fill:before { content: "\ed30"; }
.ri-fingerprint-line:before { content: "\ed31"; }
.ri-fire-fill:before { content: "\ed32"; }
.ri-fire-line:before { content: "\ed33"; }
.ri-firefox-fill:before { content: "\ed34"; }
.ri-firefox-line:before { content: "\ed35"; }
.ri-first-aid-kit-fill:before { content: "\ed36"; }
.ri-first-aid-kit-line:before { content: "\ed37"; }
.ri-flag-2-fill:before { content: "\ed38"; }
.ri-flag-2-line:before { content: "\ed39"; }
.ri-flag-fill:before { content: "\ed3a"; }
.ri-flag-line:before { content: "\ed3b"; }
.ri-flashlight-fill:before { content: "\ed3c"; }
.ri-flashlight-line:before { content: "\ed3d"; }
.ri-flask-fill:before { content: "\ed3e"; }
.ri-flask-line:before { content: "\ed3f"; }
.ri-flight-land-fill:before { content: "\ed40"; }
.ri-flight-land-line:before { content: "\ed41"; }
.ri-flight-takeoff-fill:before { content: "\ed42"; }
.ri-flight-takeoff-line:before { content: "\ed43"; }
.ri-flood-fill:before { content: "\ed44"; }
.ri-flood-line:before { content: "\ed45"; }
.ri-flow-chart:before { content: "\ed46"; }
.ri-flutter-fill:before { content: "\ed47"; }
.ri-flutter-line:before { content: "\ed48"; }
.ri-focus-2-fill:before { content: "\ed49"; }
.ri-focus-2-line:before { content: "\ed4a"; }
.ri-focus-3-fill:before { content: "\ed4b"; }
.ri-focus-3-line:before { content: "\ed4c"; }
.ri-focus-fill:before { content: "\ed4d"; }
.ri-focus-line:before { content: "\ed4e"; }
.ri-foggy-fill:before { content: "\ed4f"; }
.ri-foggy-line:before { content: "\ed50"; }
.ri-folder-2-fill:before { content: "\ed51"; }
.ri-folder-2-line:before { content: "\ed52"; }
.ri-folder-3-fill:before { content: "\ed53"; }
.ri-folder-3-line:before { content: "\ed54"; }
.ri-folder-4-fill:before { content: "\ed55"; }
.ri-folder-4-line:before { content: "\ed56"; }
.ri-folder-5-fill:before { content: "\ed57"; }
.ri-folder-5-line:before { content: "\ed58"; }
.ri-folder-add-fill:before { content: "\ed59"; }
.ri-folder-add-line:before { content: "\ed5a"; }
.ri-folder-chart-2-fill:before { content: "\ed5b"; }
.ri-folder-chart-2-line:before { content: "\ed5c"; }
.ri-folder-chart-fill:before { content: "\ed5d"; }
.ri-folder-chart-line:before { content: "\ed5e"; }
.ri-folder-download-fill:before { content: "\ed5f"; }
.ri-folder-download-line:before { content: "\ed60"; }
.ri-folder-fill:before { content: "\ed61"; }
.ri-folder-forbid-fill:before { content: "\ed62"; }
.ri-folder-forbid-line:before { content: "\ed63"; }
.ri-folder-history-fill:before { content: "\ed64"; }
.ri-folder-history-line:before { content: "\ed65"; }
.ri-folder-info-fill:before { content: "\ed66"; }
.ri-folder-info-line:before { content: "\ed67"; }
.ri-folder-keyhole-fill:before { content: "\ed68"; }
.ri-folder-keyhole-line:before { content: "\ed69"; }
.ri-folder-line:before { content: "\ed6a"; }
.ri-folder-lock-fill:before { content: "\ed6b"; }
.ri-folder-lock-line:before { content: "\ed6c"; }
.ri-folder-music-fill:before { content: "\ed6d"; }
.ri-folder-music-line:before { content: "\ed6e"; }
.ri-folder-open-fill:before { content: "\ed6f"; }
.ri-folder-open-line:before { content: "\ed70"; }
.ri-folder-received-fill:before { content: "\ed71"; }
.ri-folder-received-line:before { content: "\ed72"; }
.ri-folder-reduce-fill:before { content: "\ed73"; }
.ri-folder-reduce-line:before { content: "\ed74"; }
.ri-folder-settings-fill:before { content: "\ed75"; }
.ri-folder-settings-line:before { content: "\ed76"; }
.ri-folder-shared-fill:before { content: "\ed77"; }
.ri-folder-shared-line:before { content: "\ed78"; }
.ri-folder-shield-2-fill:before { content: "\ed79"; }
.ri-folder-shield-2-line:before { content: "\ed7a"; }
.ri-folder-shield-fill:before { content: "\ed7b"; }
.ri-folder-shield-line:before { content: "\ed7c"; }
.ri-folder-transfer-fill:before { content: "\ed7d"; }
.ri-folder-transfer-line:before { content: "\ed7e"; }
.ri-folder-unknow-fill:before { content: "\ed7f"; }
.ri-folder-unknow-line:before { content: "\ed80"; }
.ri-folder-upload-fill:before { content: "\ed81"; }
.ri-folder-upload-line:before { content: "\ed82"; }
.ri-folder-user-fill:before { content: "\ed83"; }
.ri-folder-user-line:before { content: "\ed84"; }
.ri-folder-warning-fill:before { content: "\ed85"; }
.ri-folder-warning-line:before { content: "\ed86"; }
.ri-folder-zip-fill:before { content: "\ed87"; }
.ri-folder-zip-line:before { content: "\ed88"; }
.ri-folders-fill:before { content: "\ed89"; }
.ri-folders-line:before { content: "\ed8a"; }
.ri-font-color:before { content: "\ed8b"; }
.ri-font-size-2:before { content: "\ed8c"; }
.ri-font-size:before { content: "\ed8d"; }
.ri-football-fill:before { content: "\ed8e"; }
.ri-football-line:before { content: "\ed8f"; }
.ri-footprint-fill:before { content: "\ed90"; }
.ri-footprint-line:before { content: "\ed91"; }
.ri-forbid-2-fill:before { content: "\ed92"; }
.ri-forbid-2-line:before { content: "\ed93"; }
.ri-forbid-fill:before { content: "\ed94"; }
.ri-forbid-line:before { content: "\ed95"; }
.ri-format-clear:before { content: "\ed96"; }
.ri-fridge-fill:before { content: "\ed97"; }
.ri-fridge-line:before { content: "\ed98"; }
.ri-fullscreen-exit-fill:before { content: "\ed99"; }
.ri-fullscreen-exit-line:before { content: "\ed9a"; }
.ri-fullscreen-fill:before { content: "\ed9b"; }
.ri-fullscreen-line:before { content: "\ed9c"; }
.ri-function-fill:before { content: "\ed9d"; }
.ri-function-line:before { content: "\ed9e"; }
.ri-functions:before { content: "\ed9f"; }
.ri-funds-box-fill:before { content: "\eda0"; }
.ri-funds-box-line:before { content: "\eda1"; }
.ri-funds-fill:before { content: "\eda2"; }
.ri-funds-line:before { content: "\eda3"; }
.ri-gallery-fill:before { content: "\eda4"; }
.ri-gallery-line:before { content: "\eda5"; }
.ri-gallery-upload-fill:before { content: "\eda6"; }
.ri-gallery-upload-line:before { content: "\eda7"; }
.ri-game-fill:before { content: "\eda8"; }
.ri-game-line:before { content: "\eda9"; }
.ri-gamepad-fill:before { content: "\edaa"; }
.ri-gamepad-line:before { content: "\edab"; }
.ri-gas-station-fill:before { content: "\edac"; }
.ri-gas-station-line:before { content: "\edad"; }
.ri-gatsby-fill:before { content: "\edae"; }
.ri-gatsby-line:before { content: "\edaf"; }
.ri-genderless-fill:before { content: "\edb0"; }
.ri-genderless-line:before { content: "\edb1"; }
.ri-ghost-2-fill:before { content: "\edb2"; }
.ri-ghost-2-line:before { content: "\edb3"; }
.ri-ghost-fill:before { content: "\edb4"; }
.ri-ghost-line:before { content: "\edb5"; }
.ri-ghost-smile-fill:before { content: "\edb6"; }
.ri-ghost-smile-line:before { content: "\edb7"; }
.ri-gift-2-fill:before { content: "\edb8"; }
.ri-gift-2-line:before { content: "\edb9"; }
.ri-gift-fill:before { content: "\edba"; }
.ri-gift-line:before { content: "\edbb"; }
.ri-git-branch-fill:before { content: "\edbc"; }
.ri-git-branch-line:before { content: "\edbd"; }
.ri-git-commit-fill:before { content: "\edbe"; }
.ri-git-commit-line:before { content: "\edbf"; }
.ri-git-merge-fill:before { content: "\edc0"; }
.ri-git-merge-line:before { content: "\edc1"; }
.ri-git-pull-request-fill:before { content: "\edc2"; }
.ri-git-pull-request-line:before { content: "\edc3"; }
.ri-git-repository-commits-fill:before { content: "\edc4"; }
.ri-git-repository-commits-line:before { content: "\edc5"; }
.ri-git-repository-fill:before { content: "\edc6"; }
.ri-git-repository-line:before { content: "\edc7"; }
.ri-git-repository-private-fill:before { content: "\edc8"; }
.ri-git-repository-private-line:before { content: "\edc9"; }
.ri-github-fill:before { content: "\edca"; }
.ri-github-line:before { content: "\edcb"; }
.ri-gitlab-fill:before { content: "\edcc"; }
.ri-gitlab-line:before { content: "\edcd"; }
.ri-global-fill:before { content: "\edce"; }
.ri-global-line:before { content: "\edcf"; }
.ri-globe-fill:before { content: "\edd0"; }
.ri-globe-line:before { content: "\edd1"; }
.ri-goblet-fill:before { content: "\edd2"; }
.ri-goblet-line:before { content: "\edd3"; }
.ri-google-fill:before { content: "\edd4"; }
.ri-google-line:before { content: "\edd5"; }
.ri-google-play-fill:before { content: "\edd6"; }
.ri-google-play-line:before { content: "\edd7"; }
.ri-government-fill:before { content: "\edd8"; }
.ri-government-line:before { content: "\edd9"; }
.ri-gps-fill:before { content: "\edda"; }
.ri-gps-line:before { content: "\eddb"; }
.ri-gradienter-fill:before { content: "\eddc"; }
.ri-gradienter-line:before { content: "\eddd"; }
.ri-grid-fill:before { content: "\edde"; }
.ri-grid-line:before { content: "\eddf"; }
.ri-group-2-fill:before { content: "\ede0"; }
.ri-group-2-line:before { content: "\ede1"; }
.ri-group-fill:before { content: "\ede2"; }
.ri-group-line:before { content: "\ede3"; }
.ri-guide-fill:before { content: "\ede4"; }
.ri-guide-line:before { content: "\ede5"; }
.ri-h-1:before { content: "\ede6"; }
.ri-h-2:before { content: "\ede7"; }
.ri-h-3:before { content: "\ede8"; }
.ri-h-4:before { content: "\ede9"; }
.ri-h-5:before { content: "\edea"; }
.ri-h-6:before { content: "\edeb"; }
.ri-hail-fill:before { content: "\edec"; }
.ri-hail-line:before { content: "\eded"; }
.ri-hammer-fill:before { content: "\edee"; }
.ri-hammer-line:before { content: "\edef"; }
.ri-hand-coin-fill:before { content: "\edf0"; }
.ri-hand-coin-line:before { content: "\edf1"; }
.ri-hand-heart-fill:before { content: "\edf2"; }
.ri-hand-heart-line:before { content: "\edf3"; }
.ri-hand-sanitizer-fill:before { content: "\edf4"; }
.ri-hand-sanitizer-line:before { content: "\edf5"; }
.ri-handbag-fill:before { content: "\edf6"; }
.ri-handbag-line:before { content: "\edf7"; }
.ri-hard-drive-2-fill:before { content: "\edf8"; }
.ri-hard-drive-2-line:before { content: "\edf9"; }
.ri-hard-drive-fill:before { content: "\edfa"; }
.ri-hard-drive-line:before { content: "\edfb"; }
.ri-hashtag:before { content: "\edfc"; }
.ri-haze-2-fill:before { content: "\edfd"; }
.ri-haze-2-line:before { content: "\edfe"; }
.ri-haze-fill:before { content: "\edff"; }
.ri-haze-line:before { content: "\ee00"; }
.ri-hd-fill:before { content: "\ee01"; }
.ri-hd-line:before { content: "\ee02"; }
.ri-heading:before { content: "\ee03"; }
.ri-headphone-fill:before { content: "\ee04"; }
.ri-headphone-line:before { content: "\ee05"; }
.ri-health-book-fill:before { content: "\ee06"; }
.ri-health-book-line:before { content: "\ee07"; }
.ri-heart-2-fill:before { content: "\ee08"; }
.ri-heart-2-line:before { content: "\ee09"; }
.ri-heart-3-fill:before { content: "\ee0a"; }
.ri-heart-3-line:before { content: "\ee0b"; }
.ri-heart-add-fill:before { content: "\ee0c"; }
.ri-heart-add-line:before { content: "\ee0d"; }
.ri-heart-fill:before { content: "\ee0e"; }
.ri-heart-line:before { content: "\ee0f"; }
.ri-heart-pulse-fill:before { content: "\ee10"; }
.ri-heart-pulse-line:before { content: "\ee11"; }
.ri-hearts-fill:before { content: "\ee12"; }
.ri-hearts-line:before { content: "\ee13"; }
.ri-heavy-showers-fill:before { content: "\ee14"; }
.ri-heavy-showers-line:before { content: "\ee15"; }
.ri-history-fill:before { content: "\ee16"; }
.ri-history-line:before { content: "\ee17"; }
.ri-home-2-fill:before { content: "\ee18"; }
.ri-home-2-line:before { content: "\ee19"; }
.ri-home-3-fill:before { content: "\ee1a"; }
.ri-home-3-line:before { content: "\ee1b"; }
.ri-home-4-fill:before { content: "\ee1c"; }
.ri-home-4-line:before { content: "\ee1d"; }
.ri-home-5-fill:before { content: "\ee1e"; }
.ri-home-5-line:before { content: "\ee1f"; }
.ri-home-6-fill:before { content: "\ee20"; }
.ri-home-6-line:before { content: "\ee21"; }
.ri-home-7-fill:before { content: "\ee22"; }
.ri-home-7-line:before { content: "\ee23"; }
.ri-home-8-fill:before { content: "\ee24"; }
.ri-home-8-line:before { content: "\ee25"; }
.ri-home-fill:before { content: "\ee26"; }
.ri-home-gear-fill:before { content: "\ee27"; }
.ri-home-gear-line:before { content: "\ee28"; }
.ri-home-heart-fill:before { content: "\ee29"; }
.ri-home-heart-line:before { content: "\ee2a"; }
.ri-home-line:before { content: "\ee2b"; }
.ri-home-smile-2-fill:before { content: "\ee2c"; }
.ri-home-smile-2-line:before { content: "\ee2d"; }
.ri-home-smile-fill:before { content: "\ee2e"; }
.ri-home-smile-line:before { content: "\ee2f"; }
.ri-home-wifi-fill:before { content: "\ee30"; }
.ri-home-wifi-line:before { content: "\ee31"; }
.ri-honor-of-kings-fill:before { content: "\ee32"; }
.ri-honor-of-kings-line:before { content: "\ee33"; }
.ri-honour-fill:before { content: "\ee34"; }
.ri-honour-line:before { content: "\ee35"; }
.ri-hospital-fill:before { content: "\ee36"; }
.ri-hospital-line:before { content: "\ee37"; }
.ri-hotel-bed-fill:before { content: "\ee38"; }
.ri-hotel-bed-line:before { content: "\ee39"; }
.ri-hotel-fill:before { content: "\ee3a"; }
.ri-hotel-line:before { content: "\ee3b"; }
.ri-hotspot-fill:before { content: "\ee3c"; }
.ri-hotspot-line:before { content: "\ee3d"; }
.ri-hq-fill:before { content: "\ee3e"; }
.ri-hq-line:before { content: "\ee3f"; }
.ri-html5-fill:before { content: "\ee40"; }
.ri-html5-line:before { content: "\ee41"; }
.ri-ie-fill:before { content: "\ee42"; }
.ri-ie-line:before { content: "\ee43"; }
.ri-image-2-fill:before { content: "\ee44"; }
.ri-image-2-line:before { content: "\ee45"; }
.ri-image-add-fill:before { content: "\ee46"; }
.ri-image-add-line:before { content: "\ee47"; }
.ri-image-edit-fill:before { content: "\ee48"; }
.ri-image-edit-line:before { content: "\ee49"; }
.ri-image-fill:before { content: "\ee4a"; }
.ri-image-line:before { content: "\ee4b"; }
.ri-inbox-archive-fill:before { content: "\ee4c"; }
.ri-inbox-archive-line:before { content: "\ee4d"; }
.ri-inbox-fill:before { content: "\ee4e"; }
.ri-inbox-line:before { content: "\ee4f"; }
.ri-inbox-unarchive-fill:before { content: "\ee50"; }
.ri-inbox-unarchive-line:before { content: "\ee51"; }
.ri-increase-decrease-fill:before { content: "\ee52"; }
.ri-increase-decrease-line:before { content: "\ee53"; }
.ri-indent-decrease:before { content: "\ee54"; }
.ri-indent-increase:before { content: "\ee55"; }
.ri-indeterminate-circle-fill:before { content: "\ee56"; }
.ri-indeterminate-circle-line:before { content: "\ee57"; }
.ri-information-fill:before { content: "\ee58"; }
.ri-information-line:before { content: "\ee59"; }
.ri-infrared-thermometer-fill:before { content: "\ee5a"; }
.ri-infrared-thermometer-line:before { content: "\ee5b"; }
.ri-ink-bottle-fill:before { content: "\ee5c"; }
.ri-ink-bottle-line:before { content: "\ee5d"; }
.ri-input-cursor-move:before { content: "\ee5e"; }
.ri-input-method-fill:before { content: "\ee5f"; }
.ri-input-method-line:before { content: "\ee60"; }
.ri-insert-column-left:before { content: "\ee61"; }
.ri-insert-column-right:before { content: "\ee62"; }
.ri-insert-row-bottom:before { content: "\ee63"; }
.ri-insert-row-top:before { content: "\ee64"; }
.ri-instagram-fill:before { content: "\ee65"; }
.ri-instagram-line:before { content: "\ee66"; }
.ri-install-fill:before { content: "\ee67"; }
.ri-install-line:before { content: "\ee68"; }
.ri-invision-fill:before { content: "\ee69"; }
.ri-invision-line:before { content: "\ee6a"; }
.ri-italic:before { content: "\ee6b"; }
.ri-kakao-talk-fill:before { content: "\ee6c"; }
.ri-kakao-talk-line:before { content: "\ee6d"; }
.ri-key-2-fill:before { content: "\ee6e"; }
.ri-key-2-line:before { content: "\ee6f"; }
.ri-key-fill:before { content: "\ee70"; }
.ri-key-line:before { content: "\ee71"; }
.ri-keyboard-box-fill:before { content: "\ee72"; }
.ri-keyboard-box-line:before { content: "\ee73"; }
.ri-keyboard-fill:before { content: "\ee74"; }
.ri-keyboard-line:before { content: "\ee75"; }
.ri-keynote-fill:before { content: "\ee76"; }
.ri-keynote-line:before { content: "\ee77"; }
.ri-knife-blood-fill:before { content: "\ee78"; }
.ri-knife-blood-line:before { content: "\ee79"; }
.ri-knife-fill:before { content: "\ee7a"; }
.ri-knife-line:before { content: "\ee7b"; }
.ri-landscape-fill:before { content: "\ee7c"; }
.ri-landscape-line:before { content: "\ee7d"; }
.ri-layout-2-fill:before { content: "\ee7e"; }
.ri-layout-2-line:before { content: "\ee7f"; }
.ri-layout-3-fill:before { content: "\ee80"; }
.ri-layout-3-line:before { content: "\ee81"; }
.ri-layout-4-fill:before { content: "\ee82"; }
.ri-layout-4-line:before { content: "\ee83"; }
.ri-layout-5-fill:before { content: "\ee84"; }
.ri-layout-5-line:before { content: "\ee85"; }
.ri-layout-6-fill:before { content: "\ee86"; }
.ri-layout-6-line:before { content: "\ee87"; }
.ri-layout-bottom-2-fill:before { content: "\ee88"; }
.ri-layout-bottom-2-line:before { content: "\ee89"; }
.ri-layout-bottom-fill:before { content: "\ee8a"; }
.ri-layout-bottom-line:before { content: "\ee8b"; }
.ri-layout-column-fill:before { content: "\ee8c"; }
.ri-layout-column-line:before { content: "\ee8d"; }
.ri-layout-fill:before { content: "\ee8e"; }
.ri-layout-grid-fill:before { content: "\ee8f"; }
.ri-layout-grid-line:before { content: "\ee90"; }
.ri-layout-left-2-fill:before { content: "\ee91"; }
.ri-layout-left-2-line:before { content: "\ee92"; }
.ri-layout-left-fill:before { content: "\ee93"; }
.ri-layout-left-line:before { content: "\ee94"; }
.ri-layout-line:before { content: "\ee95"; }
.ri-layout-masonry-fill:before { content: "\ee96"; }
.ri-layout-masonry-line:before { content: "\ee97"; }
.ri-layout-right-2-fill:before { content: "\ee98"; }
.ri-layout-right-2-line:before { content: "\ee99"; }
.ri-layout-right-fill:before { content: "\ee9a"; }
.ri-layout-right-line:before { content: "\ee9b"; }
.ri-layout-row-fill:before { content: "\ee9c"; }
.ri-layout-row-line:before { content: "\ee9d"; }
.ri-layout-top-2-fill:before { content: "\ee9e"; }
.ri-layout-top-2-line:before { content: "\ee9f"; }
.ri-layout-top-fill:before { content: "\eea0"; }
.ri-layout-top-line:before { content: "\eea1"; }
.ri-leaf-fill:before { content: "\eea2"; }
.ri-leaf-line:before { content: "\eea3"; }
.ri-lifebuoy-fill:before { content: "\eea4"; }
.ri-lifebuoy-line:before { content: "\eea5"; }
.ri-lightbulb-fill:before { content: "\eea6"; }
.ri-lightbulb-flash-fill:before { content: "\eea7"; }
.ri-lightbulb-flash-line:before { content: "\eea8"; }
.ri-lightbulb-line:before { content: "\eea9"; }
.ri-line-chart-fill:before { content: "\eeaa"; }
.ri-line-chart-line:before { content: "\eeab"; }
.ri-line-fill:before { content: "\eeac"; }
.ri-line-height:before { content: "\eead"; }
.ri-line-line:before { content: "\eeae"; }
.ri-link-m:before { content: "\eeaf"; }
.ri-link-unlink-m:before { content: "\eeb0"; }
.ri-link-unlink:before { content: "\eeb1"; }
.ri-link:before { content: "\eeb2"; }
.ri-linkedin-box-fill:before { content: "\eeb3"; }
.ri-linkedin-box-line:before { content: "\eeb4"; }
.ri-linkedin-fill:before { content: "\eeb5"; }
.ri-linkedin-line:before { content: "\eeb6"; }
.ri-links-fill:before { content: "\eeb7"; }
.ri-links-line:before { content: "\eeb8"; }
.ri-list-check-2:before { content: "\eeb9"; }
.ri-list-check:before { content: "\eeba"; }
.ri-list-ordered:before { content: "\eebb"; }
.ri-list-settings-fill:before { content: "\eebc"; }
.ri-list-settings-line:before { content: "\eebd"; }
.ri-list-unordered:before { content: "\eebe"; }
.ri-live-fill:before { content: "\eebf"; }
.ri-live-line:before { content: "\eec0"; }
.ri-loader-2-fill:before { content: "\eec1"; }
.ri-loader-2-line:before { content: "\eec2"; }
.ri-loader-3-fill:before { content: "\eec3"; }
.ri-loader-3-line:before { content: "\eec4"; }
.ri-loader-4-fill:before { content: "\eec5"; }
.ri-loader-4-line:before { content: "\eec6"; }
.ri-loader-5-fill:before { content: "\eec7"; }
.ri-loader-5-line:before { content: "\eec8"; }
.ri-loader-fill:before { content: "\eec9"; }
.ri-loader-line:before { content: "\eeca"; }
.ri-lock-2-fill:before { content: "\eecb"; }
.ri-lock-2-line:before { content: "\eecc"; }
.ri-lock-fill:before { content: "\eecd"; }
.ri-lock-line:before { content: "\eece"; }
.ri-lock-password-fill:before { content: "\eecf"; }
.ri-lock-password-line:before { content: "\eed0"; }
.ri-lock-unlock-fill:before { content: "\eed1"; }
.ri-lock-unlock-line:before { content: "\eed2"; }
.ri-login-box-fill:before { content: "\eed3"; }
.ri-login-box-line:before { content: "\eed4"; }
.ri-login-circle-fill:before { content: "\eed5"; }
.ri-login-circle-line:before { content: "\eed6"; }
.ri-logout-box-fill:before { content: "\eed7"; }
.ri-logout-box-line:before { content: "\eed8"; }
.ri-logout-box-r-fill:before { content: "\eed9"; }
.ri-logout-box-r-line:before { content: "\eeda"; }
.ri-logout-circle-fill:before { content: "\eedb"; }
.ri-logout-circle-line:before { content: "\eedc"; }
.ri-logout-circle-r-fill:before { content: "\eedd"; }
.ri-logout-circle-r-line:before { content: "\eede"; }
.ri-luggage-cart-fill:before { content: "\eedf"; }
.ri-luggage-cart-line:before { content: "\eee0"; }
.ri-luggage-deposit-fill:before { content: "\eee1"; }
.ri-luggage-deposit-line:before { content: "\eee2"; }
.ri-lungs-fill:before { content: "\eee3"; }
.ri-lungs-line:before { content: "\eee4"; }
.ri-mac-fill:before { content: "\eee5"; }
.ri-mac-line:before { content: "\eee6"; }
.ri-macbook-fill:before { content: "\eee7"; }
.ri-macbook-line:before { content: "\eee8"; }
.ri-magic-fill:before { content: "\eee9"; }
.ri-magic-line:before { content: "\eeea"; }
.ri-mail-add-fill:before { content: "\eeeb"; }
.ri-mail-add-line:before { content: "\eeec"; }
.ri-mail-check-fill:before { content: "\eeed"; }
.ri-mail-check-line:before { content: "\eeee"; }
.ri-mail-close-fill:before { content: "\eeef"; }
.ri-mail-close-line:before { content: "\eef0"; }
.ri-mail-download-fill:before { content: "\eef1"; }
.ri-mail-download-line:before { content: "\eef2"; }
.ri-mail-fill:before { content: "\eef3"; }
.ri-mail-forbid-fill:before { content: "\eef4"; }
.ri-mail-forbid-line:before { content: "\eef5"; }
.ri-mail-line:before { content: "\eef6"; }
.ri-mail-lock-fill:before { content: "\eef7"; }
.ri-mail-lock-line:before { content: "\eef8"; }
.ri-mail-open-fill:before { content: "\eef9"; }
.ri-mail-open-line:before { content: "\eefa"; }
.ri-mail-send-fill:before { content: "\eefb"; }
.ri-mail-send-line:before { content: "\eefc"; }
.ri-mail-settings-fill:before { content: "\eefd"; }
.ri-mail-settings-line:before { content: "\eefe"; }
.ri-mail-star-fill:before { content: "\eeff"; }
.ri-mail-star-line:before { content: "\ef00"; }
.ri-mail-unread-fill:before { content: "\ef01"; }
.ri-mail-unread-line:before { content: "\ef02"; }
.ri-mail-volume-fill:before { content: "\ef03"; }
.ri-mail-volume-line:before { content: "\ef04"; }
.ri-map-2-fill:before { content: "\ef05"; }
.ri-map-2-line:before { content: "\ef06"; }
.ri-map-fill:before { content: "\ef07"; }
.ri-map-line:before { content: "\ef08"; }
.ri-map-pin-2-fill:before { content: "\ef09"; }
.ri-map-pin-2-line:before { content: "\ef0a"; }
.ri-map-pin-3-fill:before { content: "\ef0b"; }
.ri-map-pin-3-line:before { content: "\ef0c"; }
.ri-map-pin-4-fill:before { content: "\ef0d"; }
.ri-map-pin-4-line:before { content: "\ef0e"; }
.ri-map-pin-5-fill:before { content: "\ef0f"; }
.ri-map-pin-5-line:before { content: "\ef10"; }
.ri-map-pin-add-fill:before { content: "\ef11"; }
.ri-map-pin-add-line:before { content: "\ef12"; }
.ri-map-pin-fill:before { content: "\ef13"; }
.ri-map-pin-line:before { content: "\ef14"; }
.ri-map-pin-range-fill:before { content: "\ef15"; }
.ri-map-pin-range-line:before { content: "\ef16"; }
.ri-map-pin-time-fill:before { content: "\ef17"; }
.ri-map-pin-time-line:before { content: "\ef18"; }
.ri-map-pin-user-fill:before { content: "\ef19"; }
.ri-map-pin-user-line:before { content: "\ef1a"; }
.ri-mark-pen-fill:before { content: "\ef1b"; }
.ri-mark-pen-line:before { content: "\ef1c"; }
.ri-markdown-fill:before { content: "\ef1d"; }
.ri-markdown-line:before { content: "\ef1e"; }
.ri-markup-fill:before { content: "\ef1f"; }
.ri-markup-line:before { content: "\ef20"; }
.ri-mastercard-fill:before { content: "\ef21"; }
.ri-mastercard-line:before { content: "\ef22"; }
.ri-mastodon-fill:before { content: "\ef23"; }
.ri-mastodon-line:before { content: "\ef24"; }
.ri-medal-2-fill:before { content: "\ef25"; }
.ri-medal-2-line:before { content: "\ef26"; }
.ri-medal-fill:before { content: "\ef27"; }
.ri-medal-line:before { content: "\ef28"; }
.ri-medicine-bottle-fill:before { content: "\ef29"; }
.ri-medicine-bottle-line:before { content: "\ef2a"; }
.ri-medium-fill:before { content: "\ef2b"; }
.ri-medium-line:before { content: "\ef2c"; }
.ri-men-fill:before { content: "\ef2d"; }
.ri-men-line:before { content: "\ef2e"; }
.ri-mental-health-fill:before { content: "\ef2f"; }
.ri-mental-health-line:before { content: "\ef30"; }
.ri-menu-2-fill:before { content: "\ef31"; }
.ri-menu-2-line:before { content: "\ef32"; }
.ri-menu-3-fill:before { content: "\ef33"; }
.ri-menu-3-line:before { content: "\ef34"; }
.ri-menu-4-fill:before { content: "\ef35"; }
.ri-menu-4-line:before { content: "\ef36"; }
.ri-menu-5-fill:before { content: "\ef37"; }
.ri-menu-5-line:before { content: "\ef38"; }
.ri-menu-add-fill:before { content: "\ef39"; }
.ri-menu-add-line:before { content: "\ef3a"; }
.ri-menu-fill:before { content: "\ef3b"; }
.ri-menu-fold-fill:before { content: "\ef3c"; }
.ri-menu-fold-line:before { content: "\ef3d"; }
.ri-menu-line:before { content: "\ef3e"; }
.ri-menu-unfold-fill:before { content: "\ef3f"; }
.ri-menu-unfold-line:before { content: "\ef40"; }
.ri-merge-cells-horizontal:before { content: "\ef41"; }
.ri-merge-cells-vertical:before { content: "\ef42"; }
.ri-message-2-fill:before { content: "\ef43"; }
.ri-message-2-line:before { content: "\ef44"; }
.ri-message-3-fill:before { content: "\ef45"; }
.ri-message-3-line:before { content: "\ef46"; }
.ri-message-fill:before { content: "\ef47"; }
.ri-message-line:before { content: "\ef48"; }
.ri-messenger-fill:before { content: "\ef49"; }
.ri-messenger-line:before { content: "\ef4a"; }
.ri-meteor-fill:before { content: "\ef4b"; }
.ri-meteor-line:before { content: "\ef4c"; }
.ri-mic-2-fill:before { content: "\ef4d"; }
.ri-mic-2-line:before { content: "\ef4e"; }
.ri-mic-fill:before { content: "\ef4f"; }
.ri-mic-line:before { content: "\ef50"; }
.ri-mic-off-fill:before { content: "\ef51"; }
.ri-mic-off-line:before { content: "\ef52"; }
.ri-mickey-fill:before { content: "\ef53"; }
.ri-mickey-line:before { content: "\ef54"; }
.ri-microscope-fill:before { content: "\ef55"; }
.ri-microscope-line:before { content: "\ef56"; }
.ri-microsoft-fill:before { content: "\ef57"; }
.ri-microsoft-line:before { content: "\ef58"; }
.ri-mind-map:before { content: "\ef59"; }
.ri-mini-program-fill:before { content: "\ef5a"; }
.ri-mini-program-line:before { content: "\ef5b"; }
.ri-mist-fill:before { content: "\ef5c"; }
.ri-mist-line:before { content: "\ef5d"; }
.ri-money-cny-box-fill:before { content: "\ef5e"; }
.ri-money-cny-box-line:before { content: "\ef5f"; }
.ri-money-cny-circle-fill:before { content: "\ef60"; }
.ri-money-cny-circle-line:before { content: "\ef61"; }
.ri-money-dollar-box-fill:before { content: "\ef62"; }
.ri-money-dollar-box-line:before { content: "\ef63"; }
.ri-money-dollar-circle-fill:before { content: "\ef64"; }
.ri-money-dollar-circle-line:before { content: "\ef65"; }
.ri-money-euro-box-fill:before { content: "\ef66"; }
.ri-money-euro-box-line:before { content: "\ef67"; }
.ri-money-euro-circle-fill:before { content: "\ef68"; }
.ri-money-euro-circle-line:before { content: "\ef69"; }
.ri-money-pound-box-fill:before { content: "\ef6a"; }
.ri-money-pound-box-line:before { content: "\ef6b"; }
.ri-money-pound-circle-fill:before { content: "\ef6c"; }
.ri-money-pound-circle-line:before { content: "\ef6d"; }
.ri-moon-clear-fill:before { content: "\ef6e"; }
.ri-moon-clear-line:before { content: "\ef6f"; }
.ri-moon-cloudy-fill:before { content: "\ef70"; }
.ri-moon-cloudy-line:before { content: "\ef71"; }
.ri-moon-fill:before { content: "\ef72"; }
.ri-moon-foggy-fill:before { content: "\ef73"; }
.ri-moon-foggy-line:before { content: "\ef74"; }
.ri-moon-line:before { content: "\ef75"; }
.ri-more-2-fill:before { content: "\ef76"; }
.ri-more-2-line:before { content: "\ef77"; }
.ri-more-fill:before { content: "\ef78"; }
.ri-more-line:before { content: "\ef79"; }
.ri-motorbike-fill:before { content: "\ef7a"; }
.ri-motorbike-line:before { content: "\ef7b"; }
.ri-mouse-fill:before { content: "\ef7c"; }
.ri-mouse-line:before { content: "\ef7d"; }
.ri-movie-2-fill:before { content: "\ef7e"; }
.ri-movie-2-line:before { content: "\ef7f"; }
.ri-movie-fill:before { content: "\ef80"; }
.ri-movie-line:before { content: "\ef81"; }
.ri-music-2-fill:before { content: "\ef82"; }
.ri-music-2-line:before { content: "\ef83"; }
.ri-music-fill:before { content: "\ef84"; }
.ri-music-line:before { content: "\ef85"; }
.ri-mv-fill:before { content: "\ef86"; }
.ri-mv-line:before { content: "\ef87"; }
.ri-navigation-fill:before { content: "\ef88"; }
.ri-navigation-line:before { content: "\ef89"; }
.ri-netease-cloud-music-fill:before { content: "\ef8a"; }
.ri-netease-cloud-music-line:before { content: "\ef8b"; }
.ri-netflix-fill:before { content: "\ef8c"; }
.ri-netflix-line:before { content: "\ef8d"; }
.ri-newspaper-fill:before { content: "\ef8e"; }
.ri-newspaper-line:before { content: "\ef8f"; }
.ri-node-tree:before { content: "\ef90"; }
.ri-notification-2-fill:before { content: "\ef91"; }
.ri-notification-2-line:before { content: "\ef92"; }
.ri-notification-3-fill:before { content: "\ef93"; }
.ri-notification-3-line:before { content: "\ef94"; }
.ri-notification-4-fill:before { content: "\ef95"; }
.ri-notification-4-line:before { content: "\ef96"; }
.ri-notification-badge-fill:before { content: "\ef97"; }
.ri-notification-badge-line:before { content: "\ef98"; }
.ri-notification-fill:before { content: "\ef99"; }
.ri-notification-line:before { content: "\ef9a"; }
.ri-notification-off-fill:before { content: "\ef9b"; }
.ri-notification-off-line:before { content: "\ef9c"; }
.ri-npmjs-fill:before { content: "\ef9d"; }
.ri-npmjs-line:before { content: "\ef9e"; }
.ri-number-0:before { content: "\ef9f"; }
.ri-number-1:before { content: "\efa0"; }
.ri-number-2:before { content: "\efa1"; }
.ri-number-3:before { content: "\efa2"; }
.ri-number-4:before { content: "\efa3"; }
.ri-number-5:before { content: "\efa4"; }
.ri-number-6:before { content: "\efa5"; }
.ri-number-7:before { content: "\efa6"; }
.ri-number-8:before { content: "\efa7"; }
.ri-number-9:before { content: "\efa8"; }
.ri-numbers-fill:before { content: "\efa9"; }
.ri-numbers-line:before { content: "\efaa"; }
.ri-nurse-fill:before { content: "\efab"; }
.ri-nurse-line:before { content: "\efac"; }
.ri-oil-fill:before { content: "\efad"; }
.ri-oil-line:before { content: "\efae"; }
.ri-omega:before { content: "\efaf"; }
.ri-open-arm-fill:before { content: "\efb0"; }
.ri-open-arm-line:before { content: "\efb1"; }
.ri-open-source-fill:before { content: "\efb2"; }
.ri-open-source-line:before { content: "\efb3"; }
.ri-opera-fill:before { content: "\efb4"; }
.ri-opera-line:before { content: "\efb5"; }
.ri-order-play-fill:before { content: "\efb6"; }
.ri-order-play-line:before { content: "\efb7"; }
.ri-organization-chart:before { content: "\efb8"; }
.ri-outlet-2-fill:before { content: "\efb9"; }
.ri-outlet-2-line:before { content: "\efba"; }
.ri-outlet-fill:before { content: "\efbb"; }
.ri-outlet-line:before { content: "\efbc"; }
.ri-page-separator:before { content: "\efbd"; }
.ri-pages-fill:before { content: "\efbe"; }
.ri-pages-line:before { content: "\efbf"; }
.ri-paint-brush-fill:before { content: "\efc0"; }
.ri-paint-brush-line:before { content: "\efc1"; }
.ri-paint-fill:before { content: "\efc2"; }
.ri-paint-line:before { content: "\efc3"; }
.ri-palette-fill:before { content: "\efc4"; }
.ri-palette-line:before { content: "\efc5"; }
.ri-pantone-fill:before { content: "\efc6"; }
.ri-pantone-line:before { content: "\efc7"; }
.ri-paragraph:before { content: "\efc8"; }
.ri-parent-fill:before { content: "\efc9"; }
.ri-parent-line:before { content: "\efca"; }
.ri-parentheses-fill:before { content: "\efcb"; }
.ri-parentheses-line:before { content: "\efcc"; }
.ri-parking-box-fill:before { content: "\efcd"; }
.ri-parking-box-line:before { content: "\efce"; }
.ri-parking-fill:before { content: "\efcf"; }
.ri-parking-line:before { content: "\efd0"; }
.ri-passport-fill:before { content: "\efd1"; }
.ri-passport-line:before { content: "\efd2"; }
.ri-patreon-fill:before { content: "\efd3"; }
.ri-patreon-line:before { content: "\efd4"; }
.ri-pause-circle-fill:before { content: "\efd5"; }
.ri-pause-circle-line:before { content: "\efd6"; }
.ri-pause-fill:before { content: "\efd7"; }
.ri-pause-line:before { content: "\efd8"; }
.ri-pause-mini-fill:before { content: "\efd9"; }
.ri-pause-mini-line:before { content: "\efda"; }
.ri-paypal-fill:before { content: "\efdb"; }
.ri-paypal-line:before { content: "\efdc"; }
.ri-pen-nib-fill:before { content: "\efdd"; }
.ri-pen-nib-line:before { content: "\efde"; }
.ri-pencil-fill:before { content: "\efdf"; }
.ri-pencil-line:before { content: "\efe0"; }
.ri-pencil-ruler-2-fill:before { content: "\efe1"; }
.ri-pencil-ruler-2-line:before { content: "\efe2"; }
.ri-pencil-ruler-fill:before { content: "\efe3"; }
.ri-pencil-ruler-line:before { content: "\efe4"; }
.ri-percent-fill:before { content: "\efe5"; }
.ri-percent-line:before { content: "\efe6"; }
.ri-phone-camera-fill:before { content: "\efe7"; }
.ri-phone-camera-line:before { content: "\efe8"; }
.ri-phone-fill:before { content: "\efe9"; }
.ri-phone-find-fill:before { content: "\efea"; }
.ri-phone-find-line:before { content: "\efeb"; }
.ri-phone-line:before { content: "\efec"; }
.ri-phone-lock-fill:before { content: "\efed"; }
.ri-phone-lock-line:before { content: "\efee"; }
.ri-picture-in-picture-2-fill:before { content: "\efef"; }
.ri-picture-in-picture-2-line:before { content: "\eff0"; }
.ri-picture-in-picture-exit-fill:before { content: "\eff1"; }
.ri-picture-in-picture-exit-line:before { content: "\eff2"; }
.ri-picture-in-picture-fill:before { content: "\eff3"; }
.ri-picture-in-picture-line:before { content: "\eff4"; }
.ri-pie-chart-2-fill:before { content: "\eff5"; }
.ri-pie-chart-2-line:before { content: "\eff6"; }
.ri-pie-chart-box-fill:before { content: "\eff7"; }
.ri-pie-chart-box-line:before { content: "\eff8"; }
.ri-pie-chart-fill:before { content: "\eff9"; }
.ri-pie-chart-line:before { content: "\effa"; }
.ri-pin-distance-fill:before { content: "\effb"; }
.ri-pin-distance-line:before { content: "\effc"; }
.ri-ping-pong-fill:before { content: "\effd"; }
.ri-ping-pong-line:before { content: "\effe"; }
.ri-pinterest-fill:before { content: "\efff"; }
.ri-pinterest-line:before { content: "\f000"; }
.ri-pinyin-input:before { content: "\f001"; }
.ri-pixelfed-fill:before { content: "\f002"; }
.ri-pixelfed-line:before { content: "\f003"; }
.ri-plane-fill:before { content: "\f004"; }
.ri-plane-line:before { content: "\f005"; }
.ri-plant-fill:before { content: "\f006"; }
.ri-plant-line:before { content: "\f007"; }
.ri-play-circle-fill:before { content: "\f008"; }
.ri-play-circle-line:before { content: "\f009"; }
.ri-play-fill:before { content: "\f00a"; }
.ri-play-line:before { content: "\f00b"; }
.ri-play-list-2-fill:before { content: "\f00c"; }
.ri-play-list-2-line:before { content: "\f00d"; }
.ri-play-list-add-fill:before { content: "\f00e"; }
.ri-play-list-add-line:before { content: "\f00f"; }
.ri-play-list-fill:before { content: "\f010"; }
.ri-play-list-line:before { content: "\f011"; }
.ri-play-mini-fill:before { content: "\f012"; }
.ri-play-mini-line:before { content: "\f013"; }
.ri-playstation-fill:before { content: "\f014"; }
.ri-playstation-line:before { content: "\f015"; }
.ri-plug-2-fill:before { content: "\f016"; }
.ri-plug-2-line:before { content: "\f017"; }
.ri-plug-fill:before { content: "\f018"; }
.ri-plug-line:before { content: "\f019"; }
.ri-polaroid-2-fill:before { content: "\f01a"; }
.ri-polaroid-2-line:before { content: "\f01b"; }
.ri-polaroid-fill:before { content: "\f01c"; }
.ri-polaroid-line:before { content: "\f01d"; }
.ri-police-car-fill:before { content: "\f01e"; }
.ri-police-car-line:before { content: "\f01f"; }
.ri-price-tag-2-fill:before { content: "\f020"; }
.ri-price-tag-2-line:before { content: "\f021"; }
.ri-price-tag-3-fill:before { content: "\f022"; }
.ri-price-tag-3-line:before { content: "\f023"; }
.ri-price-tag-fill:before { content: "\f024"; }
.ri-price-tag-line:before { content: "\f025"; }
.ri-printer-cloud-fill:before { content: "\f026"; }
.ri-printer-cloud-line:before { content: "\f027"; }
.ri-printer-fill:before { content: "\f028"; }
.ri-printer-line:before { content: "\f029"; }
.ri-product-hunt-fill:before { content: "\f02a"; }
.ri-product-hunt-line:before { content: "\f02b"; }
.ri-profile-fill:before { content: "\f02c"; }
.ri-profile-line:before { content: "\f02d"; }
.ri-projector-2-fill:before { content: "\f02e"; }
.ri-projector-2-line:before { content: "\f02f"; }
.ri-projector-fill:before { content: "\f030"; }
.ri-projector-line:before { content: "\f031"; }
.ri-psychotherapy-fill:before { content: "\f032"; }
.ri-psychotherapy-line:before { content: "\f033"; }
.ri-pulse-fill:before { content: "\f034"; }
.ri-pulse-line:before { content: "\f035"; }
.ri-pushpin-2-fill:before { content: "\f036"; }
.ri-pushpin-2-line:before { content: "\f037"; }
.ri-pushpin-fill:before { content: "\f038"; }
.ri-pushpin-line:before { content: "\f039"; }
.ri-qq-fill:before { content: "\f03a"; }
.ri-qq-line:before { content: "\f03b"; }
.ri-qr-code-fill:before { content: "\f03c"; }
.ri-qr-code-line:before { content: "\f03d"; }
.ri-qr-scan-2-fill:before { content: "\f03e"; }
.ri-qr-scan-2-line:before { content: "\f03f"; }
.ri-qr-scan-fill:before { content: "\f040"; }
.ri-qr-scan-line:before { content: "\f041"; }
.ri-question-answer-fill:before { content: "\f042"; }
.ri-question-answer-line:before { content: "\f043"; }
.ri-question-fill:before { content: "\f044"; }
.ri-question-line:before { content: "\f045"; }
.ri-question-mark:before { content: "\f046"; }
.ri-questionnaire-fill:before { content: "\f047"; }
.ri-questionnaire-line:before { content: "\f048"; }
.ri-quill-pen-fill:before { content: "\f049"; }
.ri-quill-pen-line:before { content: "\f04a"; }
.ri-radar-fill:before { content: "\f04b"; }
.ri-radar-line:before { content: "\f04c"; }
.ri-radio-2-fill:before { content: "\f04d"; }
.ri-radio-2-line:before { content: "\f04e"; }
.ri-radio-button-fill:before { content: "\f04f"; }
.ri-radio-button-line:before { content: "\f050"; }
.ri-radio-fill:before { content: "\f051"; }
.ri-radio-line:before { content: "\f052"; }
.ri-rainbow-fill:before { content: "\f053"; }
.ri-rainbow-line:before { content: "\f054"; }
.ri-rainy-fill:before { content: "\f055"; }
.ri-rainy-line:before { content: "\f056"; }
.ri-reactjs-fill:before { content: "\f057"; }
.ri-reactjs-line:before { content: "\f058"; }
.ri-record-circle-fill:before { content: "\f059"; }
.ri-record-circle-line:before { content: "\f05a"; }
.ri-record-mail-fill:before { content: "\f05b"; }
.ri-record-mail-line:before { content: "\f05c"; }
.ri-recycle-fill:before { content: "\f05d"; }
.ri-recycle-line:before { content: "\f05e"; }
.ri-red-packet-fill:before { content: "\f05f"; }
.ri-red-packet-line:before { content: "\f060"; }
.ri-reddit-fill:before { content: "\f061"; }
.ri-reddit-line:before { content: "\f062"; }
.ri-refresh-fill:before { content: "\f063"; }
.ri-refresh-line:before { content: "\f064"; }
.ri-refund-2-fill:before { content: "\f065"; }
.ri-refund-2-line:before { content: "\f066"; }
.ri-refund-fill:before { content: "\f067"; }
.ri-refund-line:before { content: "\f068"; }
.ri-registered-fill:before { content: "\f069"; }
.ri-registered-line:before { content: "\f06a"; }
.ri-remixicon-fill:before { content: "\f06b"; }
.ri-remixicon-line:before { content: "\f06c"; }
.ri-remote-control-2-fill:before { content: "\f06d"; }
.ri-remote-control-2-line:before { content: "\f06e"; }
.ri-remote-control-fill:before { content: "\f06f"; }
.ri-remote-control-line:before { content: "\f070"; }
.ri-repeat-2-fill:before { content: "\f071"; }
.ri-repeat-2-line:before { content: "\f072"; }
.ri-repeat-fill:before { content: "\f073"; }
.ri-repeat-line:before { content: "\f074"; }
.ri-repeat-one-fill:before { content: "\f075"; }
.ri-repeat-one-line:before { content: "\f076"; }
.ri-reply-all-fill:before { content: "\f077"; }
.ri-reply-all-line:before { content: "\f078"; }
.ri-reply-fill:before { content: "\f079"; }
.ri-reply-line:before { content: "\f07a"; }
.ri-reserved-fill:before { content: "\f07b"; }
.ri-reserved-line:before { content: "\f07c"; }
.ri-rest-time-fill:before { content: "\f07d"; }
.ri-rest-time-line:before { content: "\f07e"; }
.ri-restart-fill:before { content: "\f07f"; }
.ri-restart-line:before { content: "\f080"; }
.ri-restaurant-2-fill:before { content: "\f081"; }
.ri-restaurant-2-line:before { content: "\f082"; }
.ri-restaurant-fill:before { content: "\f083"; }
.ri-restaurant-line:before { content: "\f084"; }
.ri-rewind-fill:before { content: "\f085"; }
.ri-rewind-line:before { content: "\f086"; }
.ri-rewind-mini-fill:before { content: "\f087"; }
.ri-rewind-mini-line:before { content: "\f088"; }
.ri-rhythm-fill:before { content: "\f089"; }
.ri-rhythm-line:before { content: "\f08a"; }
.ri-riding-fill:before { content: "\f08b"; }
.ri-riding-line:before { content: "\f08c"; }
.ri-road-map-fill:before { content: "\f08d"; }
.ri-road-map-line:before { content: "\f08e"; }
.ri-roadster-fill:before { content: "\f08f"; }
.ri-roadster-line:before { content: "\f090"; }
.ri-robot-fill:before { content: "\f091"; }
.ri-robot-line:before { content: "\f092"; }
.ri-rocket-2-fill:before { content: "\f093"; }
.ri-rocket-2-line:before { content: "\f094"; }
.ri-rocket-fill:before { content: "\f095"; }
.ri-rocket-line:before { content: "\f096"; }
.ri-rotate-lock-fill:before { content: "\f097"; }
.ri-rotate-lock-line:before { content: "\f098"; }
.ri-rounded-corner:before { content: "\f099"; }
.ri-route-fill:before { content: "\f09a"; }
.ri-route-line:before { content: "\f09b"; }
.ri-router-fill:before { content: "\f09c"; }
.ri-router-line:before { content: "\f09d"; }
.ri-rss-fill:before { content: "\f09e"; }
.ri-rss-line:before { content: "\f09f"; }
.ri-ruler-2-fill:before { content: "\f0a0"; }
.ri-ruler-2-line:before { content: "\f0a1"; }
.ri-ruler-fill:before { content: "\f0a2"; }
.ri-ruler-line:before { content: "\f0a3"; }
.ri-run-fill:before { content: "\f0a4"; }
.ri-run-line:before { content: "\f0a5"; }
.ri-safari-fill:before { content: "\f0a6"; }
.ri-safari-line:before { content: "\f0a7"; }
.ri-safe-2-fill:before { content: "\f0a8"; }
.ri-safe-2-line:before { content: "\f0a9"; }
.ri-safe-fill:before { content: "\f0aa"; }
.ri-safe-line:before { content: "\f0ab"; }
.ri-sailboat-fill:before { content: "\f0ac"; }
.ri-sailboat-line:before { content: "\f0ad"; }
.ri-save-2-fill:before { content: "\f0ae"; }
.ri-save-2-line:before { content: "\f0af"; }
.ri-save-3-fill:before { content: "\f0b0"; }
.ri-save-3-line:before { content: "\f0b1"; }
.ri-save-fill:before { content: "\f0b2"; }
.ri-save-line:before { content: "\f0b3"; }
.ri-scales-2-fill:before { content: "\f0b4"; }
.ri-scales-2-line:before { content: "\f0b5"; }
.ri-scales-3-fill:before { content: "\f0b6"; }
.ri-scales-3-line:before { content: "\f0b7"; }
.ri-scales-fill:before { content: "\f0b8"; }
.ri-scales-line:before { content: "\f0b9"; }
.ri-scan-2-fill:before { content: "\f0ba"; }
.ri-scan-2-line:before { content: "\f0bb"; }
.ri-scan-fill:before { content: "\f0bc"; }
.ri-scan-line:before { content: "\f0bd"; }
.ri-scissors-2-fill:before { content: "\f0be"; }
.ri-scissors-2-line:before { content: "\f0bf"; }
.ri-scissors-cut-fill:before { content: "\f0c0"; }
.ri-scissors-cut-line:before { content: "\f0c1"; }
.ri-scissors-fill:before { content: "\f0c2"; }
.ri-scissors-line:before { content: "\f0c3"; }
.ri-screenshot-2-fill:before { content: "\f0c4"; }
.ri-screenshot-2-line:before { content: "\f0c5"; }
.ri-screenshot-fill:before { content: "\f0c6"; }
.ri-screenshot-line:before { content: "\f0c7"; }
.ri-sd-card-fill:before { content: "\f0c8"; }
.ri-sd-card-line:before { content: "\f0c9"; }
.ri-sd-card-mini-fill:before { content: "\f0ca"; }
.ri-sd-card-mini-line:before { content: "\f0cb"; }
.ri-search-2-fill:before { content: "\f0cc"; }
.ri-search-2-line:before { content: "\f0cd"; }
.ri-search-eye-fill:before { content: "\f0ce"; }
.ri-search-eye-line:before { content: "\f0cf"; }
.ri-search-fill:before { content: "\f0d0"; }
.ri-search-line:before { content: "\f0d1"; }
.ri-secure-payment-fill:before { content: "\f0d2"; }
.ri-secure-payment-line:before { content: "\f0d3"; }
.ri-seedling-fill:before { content: "\f0d4"; }
.ri-seedling-line:before { content: "\f0d5"; }
.ri-send-backward:before { content: "\f0d6"; }
.ri-send-plane-2-fill:before { content: "\f0d7"; }
.ri-send-plane-2-line:before { content: "\f0d8"; }
.ri-send-plane-fill:before { content: "\f0d9"; }
.ri-send-plane-line:before { content: "\f0da"; }
.ri-send-to-back:before { content: "\f0db"; }
.ri-sensor-fill:before { content: "\f0dc"; }
.ri-sensor-line:before { content: "\f0dd"; }
.ri-separator:before { content: "\f0de"; }
.ri-server-fill:before { content: "\f0df"; }
.ri-server-line:before { content: "\f0e0"; }
.ri-service-fill:before { content: "\f0e1"; }
.ri-service-line:before { content: "\f0e2"; }
.ri-settings-2-fill:before { content: "\f0e3"; }
.ri-settings-2-line:before { content: "\f0e4"; }
.ri-settings-3-fill:before { content: "\f0e5"; }
.ri-settings-3-line:before { content: "\f0e6"; }
.ri-settings-4-fill:before { content: "\f0e7"; }
.ri-settings-4-line:before { content: "\f0e8"; }
.ri-settings-5-fill:before { content: "\f0e9"; }
.ri-settings-5-line:before { content: "\f0ea"; }
.ri-settings-6-fill:before { content: "\f0eb"; }
.ri-settings-6-line:before { content: "\f0ec"; }
.ri-settings-fill:before { content: "\f0ed"; }
.ri-settings-line:before { content: "\f0ee"; }
.ri-shape-2-fill:before { content: "\f0ef"; }
.ri-shape-2-line:before { content: "\f0f0"; }
.ri-shape-fill:before { content: "\f0f1"; }
.ri-shape-line:before { content: "\f0f2"; }
.ri-share-box-fill:before { content: "\f0f3"; }
.ri-share-box-line:before { content: "\f0f4"; }
.ri-share-circle-fill:before { content: "\f0f5"; }
.ri-share-circle-line:before { content: "\f0f6"; }
.ri-share-fill:before { content: "\f0f7"; }
.ri-share-forward-2-fill:before { content: "\f0f8"; }
.ri-share-forward-2-line:before { content: "\f0f9"; }
.ri-share-forward-box-fill:before { content: "\f0fa"; }
.ri-share-forward-box-line:before { content: "\f0fb"; }
.ri-share-forward-fill:before { content: "\f0fc"; }
.ri-share-forward-line:before { content: "\f0fd"; }
.ri-share-line:before { content: "\f0fe"; }
.ri-shield-check-fill:before { content: "\f0ff"; }
.ri-shield-check-line:before { content: "\f100"; }
.ri-shield-cross-fill:before { content: "\f101"; }
.ri-shield-cross-line:before { content: "\f102"; }
.ri-shield-fill:before { content: "\f103"; }
.ri-shield-flash-fill:before { content: "\f104"; }
.ri-shield-flash-line:before { content: "\f105"; }
.ri-shield-keyhole-fill:before { content: "\f106"; }
.ri-shield-keyhole-line:before { content: "\f107"; }
.ri-shield-line:before { content: "\f108"; }
.ri-shield-star-fill:before { content: "\f109"; }
.ri-shield-star-line:before { content: "\f10a"; }
.ri-shield-user-fill:before { content: "\f10b"; }
.ri-shield-user-line:before { content: "\f10c"; }
.ri-ship-2-fill:before { content: "\f10d"; }
.ri-ship-2-line:before { content: "\f10e"; }
.ri-ship-fill:before { content: "\f10f"; }
.ri-ship-line:before { content: "\f110"; }
.ri-shirt-fill:before { content: "\f111"; }
.ri-shirt-line:before { content: "\f112"; }
.ri-shopping-bag-2-fill:before { content: "\f113"; }
.ri-shopping-bag-2-line:before { content: "\f114"; }
.ri-shopping-bag-3-fill:before { content: "\f115"; }
.ri-shopping-bag-3-line:before { content: "\f116"; }
.ri-shopping-bag-fill:before { content: "\f117"; }
.ri-shopping-bag-line:before { content: "\f118"; }
.ri-shopping-basket-2-fill:before { content: "\f119"; }
.ri-shopping-basket-2-line:before { content: "\f11a"; }
.ri-shopping-basket-fill:before { content: "\f11b"; }
.ri-shopping-basket-line:before { content: "\f11c"; }
.ri-shopping-cart-2-fill:before { content: "\f11d"; }
.ri-shopping-cart-2-line:before { content: "\f11e"; }
.ri-shopping-cart-fill:before { content: "\f11f"; }
.ri-shopping-cart-line:before { content: "\f120"; }
.ri-showers-fill:before { content: "\f121"; }
.ri-showers-line:before { content: "\f122"; }
.ri-shuffle-fill:before { content: "\f123"; }
.ri-shuffle-line:before { content: "\f124"; }
.ri-shut-down-fill:before { content: "\f125"; }
.ri-shut-down-line:before { content: "\f126"; }
.ri-side-bar-fill:before { content: "\f127"; }
.ri-side-bar-line:before { content: "\f128"; }
.ri-signal-tower-fill:before { content: "\f129"; }
.ri-signal-tower-line:before { content: "\f12a"; }
.ri-signal-wifi-1-fill:before { content: "\f12b"; }
.ri-signal-wifi-1-line:before { content: "\f12c"; }
.ri-signal-wifi-2-fill:before { content: "\f12d"; }
.ri-signal-wifi-2-line:before { content: "\f12e"; }
.ri-signal-wifi-3-fill:before { content: "\f12f"; }
.ri-signal-wifi-3-line:before { content: "\f130"; }
.ri-signal-wifi-error-fill:before { content: "\f131"; }
.ri-signal-wifi-error-line:before { content: "\f132"; }
.ri-signal-wifi-fill:before { content: "\f133"; }
.ri-signal-wifi-line:before { content: "\f134"; }
.ri-signal-wifi-off-fill:before { content: "\f135"; }
.ri-signal-wifi-off-line:before { content: "\f136"; }
.ri-sim-card-2-fill:before { content: "\f137"; }
.ri-sim-card-2-line:before { content: "\f138"; }
.ri-sim-card-fill:before { content: "\f139"; }
.ri-sim-card-line:before { content: "\f13a"; }
.ri-single-quotes-l:before { content: "\f13b"; }
.ri-single-quotes-r:before { content: "\f13c"; }
.ri-sip-fill:before { content: "\f13d"; }
.ri-sip-line:before { content: "\f13e"; }
.ri-skip-back-fill:before { content: "\f13f"; }
.ri-skip-back-line:before { content: "\f140"; }
.ri-skip-back-mini-fill:before { content: "\f141"; }
.ri-skip-back-mini-line:before { content: "\f142"; }
.ri-skip-forward-fill:before { content: "\f143"; }
.ri-skip-forward-line:before { content: "\f144"; }
.ri-skip-forward-mini-fill:before { content: "\f145"; }
.ri-skip-forward-mini-line:before { content: "\f146"; }
.ri-skull-2-fill:before { content: "\f147"; }
.ri-skull-2-line:before { content: "\f148"; }
.ri-skull-fill:before { content: "\f149"; }
.ri-skull-line:before { content: "\f14a"; }
.ri-skype-fill:before { content: "\f14b"; }
.ri-skype-line:before { content: "\f14c"; }
.ri-slack-fill:before { content: "\f14d"; }
.ri-slack-line:before { content: "\f14e"; }
.ri-slice-fill:before { content: "\f14f"; }
.ri-slice-line:before { content: "\f150"; }
.ri-slideshow-2-fill:before { content: "\f151"; }
.ri-slideshow-2-line:before { content: "\f152"; }
.ri-slideshow-3-fill:before { content: "\f153"; }
.ri-slideshow-3-line:before { content: "\f154"; }
.ri-slideshow-4-fill:before { content: "\f155"; }
.ri-slideshow-4-line:before { content: "\f156"; }
.ri-slideshow-fill:before { content: "\f157"; }
.ri-slideshow-line:before { content: "\f158"; }
.ri-smartphone-fill:before { content: "\f159"; }
.ri-smartphone-line:before { content: "\f15a"; }
.ri-snapchat-fill:before { content: "\f15b"; }
.ri-snapchat-line:before { content: "\f15c"; }
.ri-snowy-fill:before { content: "\f15d"; }
.ri-snowy-line:before { content: "\f15e"; }
.ri-sort-asc:before { content: "\f15f"; }
.ri-sort-desc:before { content: "\f160"; }
.ri-sound-module-fill:before { content: "\f161"; }
.ri-sound-module-line:before { content: "\f162"; }
.ri-soundcloud-fill:before { content: "\f163"; }
.ri-soundcloud-line:before { content: "\f164"; }
.ri-space-ship-fill:before { content: "\f165"; }
.ri-space-ship-line:before { content: "\f166"; }
.ri-space:before { content: "\f167"; }
.ri-spam-2-fill:before { content: "\f168"; }
.ri-spam-2-line:before { content: "\f169"; }
.ri-spam-3-fill:before { content: "\f16a"; }
.ri-spam-3-line:before { content: "\f16b"; }
.ri-spam-fill:before { content: "\f16c"; }
.ri-spam-line:before { content: "\f16d"; }
.ri-speaker-2-fill:before { content: "\f16e"; }
.ri-speaker-2-line:before { content: "\f16f"; }
.ri-speaker-3-fill:before { content: "\f170"; }
.ri-speaker-3-line:before { content: "\f171"; }
.ri-speaker-fill:before { content: "\f172"; }
.ri-speaker-line:before { content: "\f173"; }
.ri-spectrum-fill:before { content: "\f174"; }
.ri-spectrum-line:before { content: "\f175"; }
.ri-speed-fill:before { content: "\f176"; }
.ri-speed-line:before { content: "\f177"; }
.ri-speed-mini-fill:before { content: "\f178"; }
.ri-speed-mini-line:before { content: "\f179"; }
.ri-split-cells-horizontal:before { content: "\f17a"; }
.ri-split-cells-vertical:before { content: "\f17b"; }
.ri-spotify-fill:before { content: "\f17c"; }
.ri-spotify-line:before { content: "\f17d"; }
.ri-spy-fill:before { content: "\f17e"; }
.ri-spy-line:before { content: "\f17f"; }
.ri-stack-fill:before { content: "\f180"; }
.ri-stack-line:before { content: "\f181"; }
.ri-stack-overflow-fill:before { content: "\f182"; }
.ri-stack-overflow-line:before { content: "\f183"; }
.ri-stackshare-fill:before { content: "\f184"; }
.ri-stackshare-line:before { content: "\f185"; }
.ri-star-fill:before { content: "\f186"; }
.ri-star-half-fill:before { content: "\f187"; }
.ri-star-half-line:before { content: "\f188"; }
.ri-star-half-s-fill:before { content: "\f189"; }
.ri-star-half-s-line:before { content: "\f18a"; }
.ri-star-line:before { content: "\f18b"; }
.ri-star-s-fill:before { content: "\f18c"; }
.ri-star-s-line:before { content: "\f18d"; }
.ri-star-smile-fill:before { content: "\f18e"; }
.ri-star-smile-line:before { content: "\f18f"; }
.ri-steam-fill:before { content: "\f190"; }
.ri-steam-line:before { content: "\f191"; }
.ri-steering-2-fill:before { content: "\f192"; }
.ri-steering-2-line:before { content: "\f193"; }
.ri-steering-fill:before { content: "\f194"; }
.ri-steering-line:before { content: "\f195"; }
.ri-stethoscope-fill:before { content: "\f196"; }
.ri-stethoscope-line:before { content: "\f197"; }
.ri-sticky-note-2-fill:before { content: "\f198"; }
.ri-sticky-note-2-line:before { content: "\f199"; }
.ri-sticky-note-fill:before { content: "\f19a"; }
.ri-sticky-note-line:before { content: "\f19b"; }
.ri-stock-fill:before { content: "\f19c"; }
.ri-stock-line:before { content: "\f19d"; }
.ri-stop-circle-fill:before { content: "\f19e"; }
.ri-stop-circle-line:before { content: "\f19f"; }
.ri-stop-fill:before { content: "\f1a0"; }
.ri-stop-line:before { content: "\f1a1"; }
.ri-stop-mini-fill:before { content: "\f1a2"; }
.ri-stop-mini-line:before { content: "\f1a3"; }
.ri-store-2-fill:before { content: "\f1a4"; }
.ri-store-2-line:before { content: "\f1a5"; }
.ri-store-3-fill:before { content: "\f1a6"; }
.ri-store-3-line:before { content: "\f1a7"; }
.ri-store-fill:before { content: "\f1a8"; }
.ri-store-line:before { content: "\f1a9"; }
.ri-strikethrough-2:before { content: "\f1aa"; }
.ri-strikethrough:before { content: "\f1ab"; }
.ri-subscript-2:before { content: "\f1ac"; }
.ri-subscript:before { content: "\f1ad"; }
.ri-subtract-fill:before { content: "\f1ae"; }
.ri-subtract-line:before { content: "\f1af"; }
.ri-subway-fill:before { content: "\f1b0"; }
.ri-subway-line:before { content: "\f1b1"; }
.ri-subway-wifi-fill:before { content: "\f1b2"; }
.ri-subway-wifi-line:before { content: "\f1b3"; }
.ri-suitcase-2-fill:before { content: "\f1b4"; }
.ri-suitcase-2-line:before { content: "\f1b5"; }
.ri-suitcase-3-fill:before { content: "\f1b6"; }
.ri-suitcase-3-line:before { content: "\f1b7"; }
.ri-suitcase-fill:before { content: "\f1b8"; }
.ri-suitcase-line:before { content: "\f1b9"; }
.ri-sun-cloudy-fill:before { content: "\f1ba"; }
.ri-sun-cloudy-line:before { content: "\f1bb"; }
.ri-sun-fill:before { content: "\f1bc"; }
.ri-sun-foggy-fill:before { content: "\f1bd"; }
.ri-sun-foggy-line:before { content: "\f1be"; }
.ri-sun-line:before { content: "\f1bf"; }
.ri-superscript-2:before { content: "\f1c0"; }
.ri-superscript:before { content: "\f1c1"; }
.ri-surgical-mask-fill:before { content: "\f1c2"; }
.ri-surgical-mask-line:before { content: "\f1c3"; }
.ri-surround-sound-fill:before { content: "\f1c4"; }
.ri-surround-sound-line:before { content: "\f1c5"; }
.ri-survey-fill:before { content: "\f1c6"; }
.ri-survey-line:before { content: "\f1c7"; }
.ri-swap-box-fill:before { content: "\f1c8"; }
.ri-swap-box-line:before { content: "\f1c9"; }
.ri-swap-fill:before { content: "\f1ca"; }
.ri-swap-line:before { content: "\f1cb"; }
.ri-switch-fill:before { content: "\f1cc"; }
.ri-switch-line:before { content: "\f1cd"; }
.ri-sword-fill:before { content: "\f1ce"; }
.ri-sword-line:before { content: "\f1cf"; }
.ri-syringe-fill:before { content: "\f1d0"; }
.ri-syringe-line:before { content: "\f1d1"; }
.ri-t-box-fill:before { content: "\f1d2"; }
.ri-t-box-line:before { content: "\f1d3"; }
.ri-t-shirt-2-fill:before { content: "\f1d4"; }
.ri-t-shirt-2-line:before { content: "\f1d5"; }
.ri-t-shirt-air-fill:before { content: "\f1d6"; }
.ri-t-shirt-air-line:before { content: "\f1d7"; }
.ri-t-shirt-fill:before { content: "\f1d8"; }
.ri-t-shirt-line:before { content: "\f1d9"; }
.ri-table-2:before { content: "\f1da"; }
.ri-table-alt-fill:before { content: "\f1db"; }
.ri-table-alt-line:before { content: "\f1dc"; }
.ri-table-fill:before { content: "\f1dd"; }
.ri-table-line:before { content: "\f1de"; }
.ri-tablet-fill:before { content: "\f1df"; }
.ri-tablet-line:before { content: "\f1e0"; }
.ri-takeaway-fill:before { content: "\f1e1"; }
.ri-takeaway-line:before { content: "\f1e2"; }
.ri-taobao-fill:before { content: "\f1e3"; }
.ri-taobao-line:before { content: "\f1e4"; }
.ri-tape-fill:before { content: "\f1e5"; }
.ri-tape-line:before { content: "\f1e6"; }
.ri-task-fill:before { content: "\f1e7"; }
.ri-task-line:before { content: "\f1e8"; }
.ri-taxi-fill:before { content: "\f1e9"; }
.ri-taxi-line:before { content: "\f1ea"; }
.ri-taxi-wifi-fill:before { content: "\f1eb"; }
.ri-taxi-wifi-line:before { content: "\f1ec"; }
.ri-team-fill:before { content: "\f1ed"; }
.ri-team-line:before { content: "\f1ee"; }
.ri-telegram-fill:before { content: "\f1ef"; }
.ri-telegram-line:before { content: "\f1f0"; }
.ri-temp-cold-fill:before { content: "\f1f1"; }
.ri-temp-cold-line:before { content: "\f1f2"; }
.ri-temp-hot-fill:before { content: "\f1f3"; }
.ri-temp-hot-line:before { content: "\f1f4"; }
.ri-terminal-box-fill:before { content: "\f1f5"; }
.ri-terminal-box-line:before { content: "\f1f6"; }
.ri-terminal-fill:before { content: "\f1f7"; }
.ri-terminal-line:before { content: "\f1f8"; }
.ri-terminal-window-fill:before { content: "\f1f9"; }
.ri-terminal-window-line:before { content: "\f1fa"; }
.ri-test-tube-fill:before { content: "\f1fb"; }
.ri-test-tube-line:before { content: "\f1fc"; }
.ri-text-direction-l:before { content: "\f1fd"; }
.ri-text-direction-r:before { content: "\f1fe"; }
.ri-text-spacing:before { content: "\f1ff"; }
.ri-text-wrap:before { content: "\f200"; }
.ri-text:before { content: "\f201"; }
.ri-thermometer-fill:before { content: "\f202"; }
.ri-thermometer-line:before { content: "\f203"; }
.ri-thumb-down-fill:before { content: "\f204"; }
.ri-thumb-down-line:before { content: "\f205"; }
.ri-thumb-up-fill:before { content: "\f206"; }
.ri-thumb-up-line:before { content: "\f207"; }
.ri-thunderstorms-fill:before { content: "\f208"; }
.ri-thunderstorms-line:before { content: "\f209"; }
.ri-ticket-2-fill:before { content: "\f20a"; }
.ri-ticket-2-line:before { content: "\f20b"; }
.ri-ticket-fill:before { content: "\f20c"; }
.ri-ticket-line:before { content: "\f20d"; }
.ri-time-fill:before { content: "\f20e"; }
.ri-time-line:before { content: "\f20f"; }
.ri-timer-2-fill:before { content: "\f210"; }
.ri-timer-2-line:before { content: "\f211"; }
.ri-timer-fill:before { content: "\f212"; }
.ri-timer-flash-fill:before { content: "\f213"; }
.ri-timer-flash-line:before { content: "\f214"; }
.ri-timer-line:before { content: "\f215"; }
.ri-todo-fill:before { content: "\f216"; }
.ri-todo-line:before { content: "\f217"; }
.ri-toggle-fill:before { content: "\f218"; }
.ri-toggle-line:before { content: "\f219"; }
.ri-tools-fill:before { content: "\f21a"; }
.ri-tools-line:before { content: "\f21b"; }
.ri-tornado-fill:before { content: "\f21c"; }
.ri-tornado-line:before { content: "\f21d"; }
.ri-trademark-fill:before { content: "\f21e"; }
.ri-trademark-line:before { content: "\f21f"; }
.ri-traffic-light-fill:before { content: "\f220"; }
.ri-traffic-light-line:before { content: "\f221"; }
.ri-train-fill:before { content: "\f222"; }
.ri-train-line:before { content: "\f223"; }
.ri-train-wifi-fill:before { content: "\f224"; }
.ri-train-wifi-line:before { content: "\f225"; }
.ri-translate-2:before { content: "\f226"; }
.ri-translate:before { content: "\f227"; }
.ri-travesti-fill:before { content: "\f228"; }
.ri-travesti-line:before { content: "\f229"; }
.ri-treasure-map-fill:before { content: "\f22a"; }
.ri-treasure-map-line:before { content: "\f22b"; }
.ri-trello-fill:before { content: "\f22c"; }
.ri-trello-line:before { content: "\f22d"; }
.ri-trophy-fill:before { content: "\f22e"; }
.ri-trophy-line:before { content: "\f22f"; }
.ri-truck-fill:before { content: "\f230"; }
.ri-truck-line:before { content: "\f231"; }
.ri-tumblr-fill:before { content: "\f232"; }
.ri-tumblr-line:before { content: "\f233"; }
.ri-tv-2-fill:before { content: "\f234"; }
.ri-tv-2-line:before { content: "\f235"; }
.ri-tv-fill:before { content: "\f236"; }
.ri-tv-line:before { content: "\f237"; }
.ri-twitch-fill:before { content: "\f238"; }
.ri-twitch-line:before { content: "\f239"; }
.ri-twitter-fill:before { content: "\f23a"; }
.ri-twitter-line:before { content: "\f23b"; }
.ri-typhoon-fill:before { content: "\f23c"; }
.ri-typhoon-line:before { content: "\f23d"; }
.ri-u-disk-fill:before { content: "\f23e"; }
.ri-u-disk-line:before { content: "\f23f"; }
.ri-ubuntu-fill:before { content: "\f240"; }
.ri-ubuntu-line:before { content: "\f241"; }
.ri-umbrella-fill:before { content: "\f242"; }
.ri-umbrella-line:before { content: "\f243"; }
.ri-underline:before { content: "\f244"; }
.ri-uninstall-fill:before { content: "\f245"; }
.ri-uninstall-line:before { content: "\f246"; }
.ri-unsplash-fill:before { content: "\f247"; }
.ri-unsplash-line:before { content: "\f248"; }
.ri-upload-2-fill:before { content: "\f249"; }
.ri-upload-2-line:before { content: "\f24a"; }
.ri-upload-cloud-2-fill:before { content: "\f24b"; }
.ri-upload-cloud-2-line:before { content: "\f24c"; }
.ri-upload-cloud-fill:before { content: "\f24d"; }
.ri-upload-cloud-line:before { content: "\f24e"; }
.ri-upload-fill:before { content: "\f24f"; }
.ri-upload-line:before { content: "\f250"; }
.ri-usb-fill:before { content: "\f251"; }
.ri-usb-line:before { content: "\f252"; }
.ri-user-2-fill:before { content: "\f253"; }
.ri-user-2-line:before { content: "\f254"; }
.ri-user-3-fill:before { content: "\f255"; }
.ri-user-3-line:before { content: "\f256"; }
.ri-user-4-fill:before { content: "\f257"; }
.ri-user-4-line:before { content: "\f258"; }
.ri-user-5-fill:before { content: "\f259"; }
.ri-user-5-line:before { content: "\f25a"; }
.ri-user-6-fill:before { content: "\f25b"; }
.ri-user-6-line:before { content: "\f25c"; }
.ri-user-add-fill:before { content: "\f25d"; }
.ri-user-add-line:before { content: "\f25e"; }
.ri-user-fill:before { content: "\f25f"; }
.ri-user-follow-fill:before { content: "\f260"; }
.ri-user-follow-line:before { content: "\f261"; }
.ri-user-heart-fill:before { content: "\f262"; }
.ri-user-heart-line:before { content: "\f263"; }
.ri-user-line:before { content: "\f264"; }
.ri-user-location-fill:before { content: "\f265"; }
.ri-user-location-line:before { content: "\f266"; }
.ri-user-received-2-fill:before { content: "\f267"; }
.ri-user-received-2-line:before { content: "\f268"; }
.ri-user-received-fill:before { content: "\f269"; }
.ri-user-received-line:before { content: "\f26a"; }
.ri-user-search-fill:before { content: "\f26b"; }
.ri-user-search-line:before { content: "\f26c"; }
.ri-user-settings-fill:before { content: "\f26d"; }
.ri-user-settings-line:before { content: "\f26e"; }
.ri-user-shared-2-fill:before { content: "\f26f"; }
.ri-user-shared-2-line:before { content: "\f270"; }
.ri-user-shared-fill:before { content: "\f271"; }
.ri-user-shared-line:before { content: "\f272"; }
.ri-user-smile-fill:before { content: "\f273"; }
.ri-user-smile-line:before { content: "\f274"; }
.ri-user-star-fill:before { content: "\f275"; }
.ri-user-star-line:before { content: "\f276"; }
.ri-user-unfollow-fill:before { content: "\f277"; }
.ri-user-unfollow-line:before { content: "\f278"; }
.ri-user-voice-fill:before { content: "\f279"; }
.ri-user-voice-line:before { content: "\f27a"; }
.ri-video-add-fill:before { content: "\f27b"; }
.ri-video-add-line:before { content: "\f27c"; }
.ri-video-chat-fill:before { content: "\f27d"; }
.ri-video-chat-line:before { content: "\f27e"; }
.ri-video-download-fill:before { content: "\f27f"; }
.ri-video-download-line:before { content: "\f280"; }
.ri-video-fill:before { content: "\f281"; }
.ri-video-line:before { content: "\f282"; }
.ri-video-upload-fill:before { content: "\f283"; }
.ri-video-upload-line:before { content: "\f284"; }
.ri-vidicon-2-fill:before { content: "\f285"; }
.ri-vidicon-2-line:before { content: "\f286"; }
.ri-vidicon-fill:before { content: "\f287"; }
.ri-vidicon-line:before { content: "\f288"; }
.ri-vimeo-fill:before { content: "\f289"; }
.ri-vimeo-line:before { content: "\f28a"; }
.ri-vip-crown-2-fill:before { content: "\f28b"; }
.ri-vip-crown-2-line:before { content: "\f28c"; }
.ri-vip-crown-fill:before { content: "\f28d"; }
.ri-vip-crown-line:before { content: "\f28e"; }
.ri-vip-diamond-fill:before { content: "\f28f"; }
.ri-vip-diamond-line:before { content: "\f290"; }
.ri-vip-fill:before { content: "\f291"; }
.ri-vip-line:before { content: "\f292"; }
.ri-virus-fill:before { content: "\f293"; }
.ri-virus-line:before { content: "\f294"; }
.ri-visa-fill:before { content: "\f295"; }
.ri-visa-line:before { content: "\f296"; }
.ri-voice-recognition-fill:before { content: "\f297"; }
.ri-voice-recognition-line:before { content: "\f298"; }
.ri-voiceprint-fill:before { content: "\f299"; }
.ri-voiceprint-line:before { content: "\f29a"; }
.ri-volume-down-fill:before { content: "\f29b"; }
.ri-volume-down-line:before { content: "\f29c"; }
.ri-volume-mute-fill:before { content: "\f29d"; }
.ri-volume-mute-line:before { content: "\f29e"; }
.ri-volume-off-vibrate-fill:before { content: "\f29f"; }
.ri-volume-off-vibrate-line:before { content: "\f2a0"; }
.ri-volume-up-fill:before { content: "\f2a1"; }
.ri-volume-up-line:before { content: "\f2a2"; }
.ri-volume-vibrate-fill:before { content: "\f2a3"; }
.ri-volume-vibrate-line:before { content: "\f2a4"; }
.ri-vuejs-fill:before { content: "\f2a5"; }
.ri-vuejs-line:before { content: "\f2a6"; }
.ri-walk-fill:before { content: "\f2a7"; }
.ri-walk-line:before { content: "\f2a8"; }
.ri-wallet-2-fill:before { content: "\f2a9"; }
.ri-wallet-2-line:before { content: "\f2aa"; }
.ri-wallet-3-fill:before { content: "\f2ab"; }
.ri-wallet-3-line:before { content: "\f2ac"; }
.ri-wallet-fill:before { content: "\f2ad"; }
.ri-wallet-line:before { content: "\f2ae"; }
.ri-water-flash-fill:before { content: "\f2af"; }
.ri-water-flash-line:before { content: "\f2b0"; }
.ri-webcam-fill:before { content: "\f2b1"; }
.ri-webcam-line:before { content: "\f2b2"; }
.ri-wechat-2-fill:before { content: "\f2b3"; }
.ri-wechat-2-line:before { content: "\f2b4"; }
.ri-wechat-fill:before { content: "\f2b5"; }
.ri-wechat-line:before { content: "\f2b6"; }
.ri-wechat-pay-fill:before { content: "\f2b7"; }
.ri-wechat-pay-line:before { content: "\f2b8"; }
.ri-weibo-fill:before { content: "\f2b9"; }
.ri-weibo-line:before { content: "\f2ba"; }
.ri-whatsapp-fill:before { content: "\f2bb"; }
.ri-whatsapp-line:before { content: "\f2bc"; }
.ri-wheelchair-fill:before { content: "\f2bd"; }
.ri-wheelchair-line:before { content: "\f2be"; }
.ri-wifi-fill:before { content: "\f2bf"; }
.ri-wifi-line:before { content: "\f2c0"; }
.ri-wifi-off-fill:before { content: "\f2c1"; }
.ri-wifi-off-line:before { content: "\f2c2"; }
.ri-window-2-fill:before { content: "\f2c3"; }
.ri-window-2-line:before { content: "\f2c4"; }
.ri-window-fill:before { content: "\f2c5"; }
.ri-window-line:before { content: "\f2c6"; }
.ri-windows-fill:before { content: "\f2c7"; }
.ri-windows-line:before { content: "\f2c8"; }
.ri-windy-fill:before { content: "\f2c9"; }
.ri-windy-line:before { content: "\f2ca"; }
.ri-wireless-charging-fill:before { content: "\f2cb"; }
.ri-wireless-charging-line:before { content: "\f2cc"; }
.ri-women-fill:before { content: "\f2cd"; }
.ri-women-line:before { content: "\f2ce"; }
.ri-wubi-input:before { content: "\f2cf"; }
.ri-xbox-fill:before { content: "\f2d0"; }
.ri-xbox-line:before { content: "\f2d1"; }
.ri-xing-fill:before { content: "\f2d2"; }
.ri-xing-line:before { content: "\f2d3"; }
.ri-youtube-fill:before { content: "\f2d4"; }
.ri-youtube-line:before { content: "\f2d5"; }
.ri-zcool-fill:before { content: "\f2d6"; }
.ri-zcool-line:before { content: "\f2d7"; }
.ri-zhihu-fill:before { content: "\f2d8"; }
.ri-zhihu-line:before { content: "\f2d9"; }
.ri-zoom-in-fill:before { content: "\f2da"; }
.ri-zoom-in-line:before { content: "\f2db"; }
.ri-zoom-out-fill:before { content: "\f2dc"; }
.ri-zoom-out-line:before { content: "\f2dd"; }
.ri-zzz-fill:before { content: "\f2de"; }
.ri-zzz-line:before { content: "\f2df"; }
.ri-arrow-down-double-fill:before { content: "\f2e0"; }
.ri-arrow-down-double-line:before { content: "\f2e1"; }
.ri-arrow-left-double-fill:before { content: "\f2e2"; }
.ri-arrow-left-double-line:before { content: "\f2e3"; }
.ri-arrow-right-double-fill:before { content: "\f2e4"; }
.ri-arrow-right-double-line:before { content: "\f2e5"; }
.ri-arrow-turn-back-fill:before { content: "\f2e6"; }
.ri-arrow-turn-back-line:before { content: "\f2e7"; }
.ri-arrow-turn-forward-fill:before { content: "\f2e8"; }
.ri-arrow-turn-forward-line:before { content: "\f2e9"; }
.ri-arrow-up-double-fill:before { content: "\f2ea"; }
.ri-arrow-up-double-line:before { content: "\f2eb"; }
.ri-bard-fill:before { content: "\f2ec"; }
.ri-bard-line:before { content: "\f2ed"; }
.ri-bootstrap-fill:before { content: "\f2ee"; }
.ri-bootstrap-line:before { content: "\f2ef"; }
.ri-box-1-fill:before { content: "\f2f0"; }
.ri-box-1-line:before { content: "\f2f1"; }
.ri-box-2-fill:before { content: "\f2f2"; }
.ri-box-2-line:before { content: "\f2f3"; }
.ri-box-3-fill:before { content: "\f2f4"; }
.ri-box-3-line:before { content: "\f2f5"; }
.ri-brain-fill:before { content: "\f2f6"; }
.ri-brain-line:before { content: "\f2f7"; }
.ri-candle-fill:before { content: "\f2f8"; }
.ri-candle-line:before { content: "\f2f9"; }
.ri-cash-fill:before { content: "\f2fa"; }
.ri-cash-line:before { content: "\f2fb"; }
.ri-contract-left-fill:before { content: "\f2fc"; }
.ri-contract-left-line:before { content: "\f2fd"; }
.ri-contract-left-right-fill:before { content: "\f2fe"; }
.ri-contract-left-right-line:before { content: "\f2ff"; }
.ri-contract-right-fill:before { content: "\f300"; }
.ri-contract-right-line:before { content: "\f301"; }
.ri-contract-up-down-fill:before { content: "\f302"; }
.ri-contract-up-down-line:before { content: "\f303"; }
.ri-copilot-fill:before { content: "\f304"; }
.ri-copilot-line:before { content: "\f305"; }
.ri-corner-down-left-fill:before { content: "\f306"; }
.ri-corner-down-left-line:before { content: "\f307"; }
.ri-corner-down-right-fill:before { content: "\f308"; }
.ri-corner-down-right-line:before { content: "\f309"; }
.ri-corner-left-down-fill:before { content: "\f30a"; }
.ri-corner-left-down-line:before { content: "\f30b"; }
.ri-corner-left-up-fill:before { content: "\f30c"; }
.ri-corner-left-up-line:before { content: "\f30d"; }
.ri-corner-right-down-fill:before { content: "\f30e"; }
.ri-corner-right-down-line:before { content: "\f30f"; }
.ri-corner-right-up-fill:before { content: "\f310"; }
.ri-corner-right-up-line:before { content: "\f311"; }
.ri-corner-up-left-double-fill:before { content: "\f312"; }
.ri-corner-up-left-double-line:before { content: "\f313"; }
.ri-corner-up-left-fill:before { content: "\f314"; }
.ri-corner-up-left-line:before { content: "\f315"; }
.ri-corner-up-right-double-fill:before { content: "\f316"; }
.ri-corner-up-right-double-line:before { content: "\f317"; }
.ri-corner-up-right-fill:before { content: "\f318"; }
.ri-corner-up-right-line:before { content: "\f319"; }
.ri-cross-fill:before { content: "\f31a"; }
.ri-cross-line:before { content: "\f31b"; }
.ri-edge-new-fill:before { content: "\f31c"; }
.ri-edge-new-line:before { content: "\f31d"; }
.ri-equal-fill:before { content: "\f31e"; }
.ri-equal-line:before { content: "\f31f"; }
.ri-expand-left-fill:before { content: "\f320"; }
.ri-expand-left-line:before { content: "\f321"; }
.ri-expand-left-right-fill:before { content: "\f322"; }
.ri-expand-left-right-line:before { content: "\f323"; }
.ri-expand-right-fill:before { content: "\f324"; }
.ri-expand-right-line:before { content: "\f325"; }
.ri-expand-up-down-fill:before { content: "\f326"; }
.ri-expand-up-down-line:before { content: "\f327"; }
.ri-flickr-fill:before { content: "\f328"; }
.ri-flickr-line:before { content: "\f329"; }
.ri-forward-10-fill:before { content: "\f32a"; }
.ri-forward-10-line:before { content: "\f32b"; }
.ri-forward-15-fill:before { content: "\f32c"; }
.ri-forward-15-line:before { content: "\f32d"; }
.ri-forward-30-fill:before { content: "\f32e"; }
.ri-forward-30-line:before { content: "\f32f"; }
.ri-forward-5-fill:before { content: "\f330"; }
.ri-forward-5-line:before { content: "\f331"; }
.ri-graduation-cap-fill:before { content: "\f332"; }
.ri-graduation-cap-line:before { content: "\f333"; }
.ri-home-office-fill:before { content: "\f334"; }
.ri-home-office-line:before { content: "\f335"; }
.ri-hourglass-2-fill:before { content: "\f336"; }
.ri-hourglass-2-line:before { content: "\f337"; }
.ri-hourglass-fill:before { content: "\f338"; }
.ri-hourglass-line:before { content: "\f339"; }
.ri-javascript-fill:before { content: "\f33a"; }
.ri-javascript-line:before { content: "\f33b"; }
.ri-loop-left-fill:before { content: "\f33c"; }
.ri-loop-left-line:before { content: "\f33d"; }
.ri-loop-right-fill:before { content: "\f33e"; }
.ri-loop-right-line:before { content: "\f33f"; }
.ri-memories-fill:before { content: "\f340"; }
.ri-memories-line:before { content: "\f341"; }
.ri-meta-fill:before { content: "\f342"; }
.ri-meta-line:before { content: "\f343"; }
.ri-microsoft-loop-fill:before { content: "\f344"; }
.ri-microsoft-loop-line:before { content: "\f345"; }
.ri-nft-fill:before { content: "\f346"; }
.ri-nft-line:before { content: "\f347"; }
.ri-notion-fill:before { content: "\f348"; }
.ri-notion-line:before { content: "\f349"; }
.ri-openai-fill:before { content: "\f34a"; }
.ri-openai-line:before { content: "\f34b"; }
.ri-overline:before { content: "\f34c"; }
.ri-p2p-fill:before { content: "\f34d"; }
.ri-p2p-line:before { content: "\f34e"; }
.ri-presentation-fill:before { content: "\f34f"; }
.ri-presentation-line:before { content: "\f350"; }
.ri-replay-10-fill:before { content: "\f351"; }
.ri-replay-10-line:before { content: "\f352"; }
.ri-replay-15-fill:before { content: "\f353"; }
.ri-replay-15-line:before { content: "\f354"; }
.ri-replay-30-fill:before { content: "\f355"; }
.ri-replay-30-line:before { content: "\f356"; }
.ri-replay-5-fill:before { content: "\f357"; }
.ri-replay-5-line:before { content: "\f358"; }
.ri-school-fill:before { content: "\f359"; }
.ri-school-line:before { content: "\f35a"; }
.ri-shining-2-fill:before { content: "\f35b"; }
.ri-shining-2-line:before { content: "\f35c"; }
.ri-shining-fill:before { content: "\f35d"; }
.ri-shining-line:before { content: "\f35e"; }
.ri-sketching:before { content: "\f35f"; }
.ri-skip-down-fill:before { content: "\f360"; }
.ri-skip-down-line:before { content: "\f361"; }
.ri-skip-left-fill:before { content: "\f362"; }
.ri-skip-left-line:before { content: "\f363"; }
.ri-skip-right-fill:before { content: "\f364"; }
.ri-skip-right-line:before { content: "\f365"; }
.ri-skip-up-fill:before { content: "\f366"; }
.ri-skip-up-line:before { content: "\f367"; }
.ri-slow-down-fill:before { content: "\f368"; }
.ri-slow-down-line:before { content: "\f369"; }
.ri-sparkling-2-fill:before { content: "\f36a"; }
.ri-sparkling-2-line:before { content: "\f36b"; }
.ri-sparkling-fill:before { content: "\f36c"; }
.ri-sparkling-line:before { content: "\f36d"; }
.ri-speak-fill:before { content: "\f36e"; }
.ri-speak-line:before { content: "\f36f"; }
.ri-speed-up-fill:before { content: "\f370"; }
.ri-speed-up-line:before { content: "\f371"; }
.ri-tiktok-fill:before { content: "\f372"; }
.ri-tiktok-line:before { content: "\f373"; }
.ri-token-swap-fill:before { content: "\f374"; }
.ri-token-swap-line:before { content: "\f375"; }
.ri-unpin-fill:before { content: "\f376"; }
.ri-unpin-line:before { content: "\f377"; }
.ri-wechat-channels-fill:before { content: "\f378"; }
.ri-wechat-channels-line:before { content: "\f379"; }
.ri-wordpress-fill:before { content: "\f37a"; }
.ri-wordpress-line:before { content: "\f37b"; }
.ri-blender-fill:before { content: "\f37c"; }
.ri-blender-line:before { content: "\f37d"; }
.ri-emoji-sticker-fill:before { content: "\f37e"; }
.ri-emoji-sticker-line:before { content: "\f37f"; }
.ri-git-close-pull-request-fill:before { content: "\f380"; }
.ri-git-close-pull-request-line:before { content: "\f381"; }
.ri-instance-fill:before { content: "\f382"; }
.ri-instance-line:before { content: "\f383"; }
.ri-megaphone-fill:before { content: "\f384"; }
.ri-megaphone-line:before { content: "\f385"; }
.ri-pass-expired-fill:before { content: "\f386"; }
.ri-pass-expired-line:before { content: "\f387"; }
.ri-pass-pending-fill:before { content: "\f388"; }
.ri-pass-pending-line:before { content: "\f389"; }
.ri-pass-valid-fill:before { content: "\f38a"; }
.ri-pass-valid-line:before { content: "\f38b"; }
.ri-ai-generate:before { content: "\f38c"; }
.ri-calendar-close-fill:before { content: "\f38d"; }
.ri-calendar-close-line:before { content: "\f38e"; }
.ri-draggable:before { content: "\f38f"; }
.ri-font-family:before { content: "\f390"; }
.ri-font-mono:before { content: "\f391"; }
.ri-font-sans-serif:before { content: "\f392"; }
.ri-hard-drive-3-fill:before { content: "\f393"; }
.ri-hard-drive-3-line:before { content: "\f394"; }
.ri-kick-fill:before { content: "\f395"; }
.ri-kick-line:before { content: "\f396"; }
.ri-list-check-3:before { content: "\f397"; }
.ri-list-indefinite:before { content: "\f398"; }
.ri-list-ordered-2:before { content: "\f399"; }
.ri-list-radio:before { content: "\f39a"; }
.ri-openbase-fill:before { content: "\f39b"; }
.ri-openbase-line:before { content: "\f39c"; }
.ri-planet-fill:before { content: "\f39d"; }
.ri-planet-line:before { content: "\f39e"; }
.ri-prohibited-fill:before { content: "\f39f"; }
.ri-prohibited-line:before { content: "\f3a0"; }
.ri-quote-text:before { content: "\f3a1"; }
.ri-seo-fill:before { content: "\f3a2"; }
.ri-seo-line:before { content: "\f3a3"; }
.ri-slash-commands:before { content: "\f3a4"; }
.ri-archive-2-fill:before { content: "\f3a5"; }
.ri-archive-2-line:before { content: "\f3a6"; }
.ri-inbox-2-fill:before { content: "\f3a7"; }
.ri-inbox-2-line:before { content: "\f3a8"; }
.ri-shake-hands-fill:before { content: "\f3a9"; }
.ri-shake-hands-line:before { content: "\f3aa"; }
.ri-supabase-fill:before { content: "\f3ab"; }
.ri-supabase-line:before { content: "\f3ac"; }
.ri-water-percent-fill:before { content: "\f3ad"; }
.ri-water-percent-line:before { content: "\f3ae"; }
.ri-yuque-fill:before { content: "\f3af"; }
.ri-yuque-line:before { content: "\f3b0"; }
.ri-crosshair-2-fill:before { content: "\f3b1"; }
.ri-crosshair-2-line:before { content: "\f3b2"; }
.ri-crosshair-fill:before { content: "\f3b3"; }
.ri-crosshair-line:before { content: "\f3b4"; }
.ri-file-close-fill:before { content: "\f3b5"; }
.ri-file-close-line:before { content: "\f3b6"; }
.ri-infinity-fill:before { content: "\f3b7"; }
.ri-infinity-line:before { content: "\f3b8"; }
.ri-rfid-fill:before { content: "\f3b9"; }
.ri-rfid-line:before { content: "\f3ba"; }
.ri-slash-commands-2:before { content: "\f3bb"; }
.ri-user-forbid-fill:before { content: "\f3bc"; }
.ri-user-forbid-line:before { content: "\f3bd"; }
.ri-beer-fill:before { content: "\f3be"; }
.ri-beer-line:before { content: "\f3bf"; }
.ri-circle-fill:before { content: "\f3c0"; }
.ri-circle-line:before { content: "\f3c1"; }
.ri-dropdown-list:before { content: "\f3c2"; }
.ri-file-image-fill:before { content: "\f3c3"; }
.ri-file-image-line:before { content: "\f3c4"; }
.ri-file-pdf-2-fill:before { content: "\f3c5"; }
.ri-file-pdf-2-line:before { content: "\f3c6"; }
.ri-file-video-fill:before { content: "\f3c7"; }
.ri-file-video-line:before { content: "\f3c8"; }
.ri-folder-image-fill:before { content: "\f3c9"; }
.ri-folder-image-line:before { content: "\f3ca"; }
.ri-folder-video-fill:before { content: "\f3cb"; }
.ri-folder-video-line:before { content: "\f3cc"; }
.ri-hexagon-fill:before { content: "\f3cd"; }
.ri-hexagon-line:before { content: "\f3ce"; }
.ri-menu-search-fill:before { content: "\f3cf"; }
.ri-menu-search-line:before { content: "\f3d0"; }
.ri-octagon-fill:before { content: "\f3d1"; }
.ri-octagon-line:before { content: "\f3d2"; }
.ri-pentagon-fill:before { content: "\f3d3"; }
.ri-pentagon-line:before { content: "\f3d4"; }
.ri-rectangle-fill:before { content: "\f3d5"; }
.ri-rectangle-line:before { content: "\f3d6"; }
.ri-robot-2-fill:before { content: "\f3d7"; }
.ri-robot-2-line:before { content: "\f3d8"; }
.ri-shapes-fill:before { content: "\f3d9"; }
.ri-shapes-line:before { content: "\f3da"; }
.ri-square-fill:before { content: "\f3db"; }
.ri-square-line:before { content: "\f3dc"; }
.ri-tent-fill:before { content: "\f3dd"; }
.ri-tent-line:before { content: "\f3de"; }
.ri-threads-fill:before { content: "\f3df"; }
.ri-threads-line:before { content: "\f3e0"; }
.ri-tree-fill:before { content: "\f3e1"; }
.ri-tree-line:before { content: "\f3e2"; }
.ri-triangle-fill:before { content: "\f3e3"; }
.ri-triangle-line:before { content: "\f3e4"; }
.ri-twitter-x-fill:before { content: "\f3e5"; }
.ri-twitter-x-line:before { content: "\f3e6"; }
.ri-verified-badge-fill:before { content: "\f3e7"; }
.ri-verified-badge-line:before { content: "\f3e8"; }
.ri-armchair-fill:before { content: "\f3e9"; }
.ri-armchair-line:before { content: "\f3ea"; }
.ri-bnb-fill:before { content: "\f3eb"; }
.ri-bnb-line:before { content: "\f3ec"; }
.ri-bread-fill:before { content: "\f3ed"; }
.ri-bread-line:before { content: "\f3ee"; }
.ri-btc-fill:before { content: "\f3ef"; }
.ri-btc-line:before { content: "\f3f0"; }
.ri-calendar-schedule-fill:before { content: "\f3f1"; }
.ri-calendar-schedule-line:before { content: "\f3f2"; }
.ri-dice-1-fill:before { content: "\f3f3"; }
.ri-dice-1-line:before { content: "\f3f4"; }
.ri-dice-2-fill:before { content: "\f3f5"; }
.ri-dice-2-line:before { content: "\f3f6"; }
.ri-dice-3-fill:before { content: "\f3f7"; }
.ri-dice-3-line:before { content: "\f3f8"; }
.ri-dice-4-fill:before { content: "\f3f9"; }
.ri-dice-4-line:before { content: "\f3fa"; }
.ri-dice-5-fill:before { content: "\f3fb"; }
.ri-dice-5-line:before { content: "\f3fc"; }
.ri-dice-6-fill:before { content: "\f3fd"; }
.ri-dice-6-line:before { content: "\f3fe"; }
.ri-dice-fill:before { content: "\f3ff"; }
.ri-dice-line:before { content: "\f400"; }
.ri-drinks-fill:before { content: "\f401"; }
.ri-drinks-line:before { content: "\f402"; }
.ri-equalizer-2-fill:before { content: "\f403"; }
.ri-equalizer-2-line:before { content: "\f404"; }
.ri-equalizer-3-fill:before { content: "\f405"; }
.ri-equalizer-3-line:before { content: "\f406"; }
.ri-eth-fill:before { content: "\f407"; }
.ri-eth-line:before { content: "\f408"; }
.ri-flower-fill:before { content: "\f409"; }
.ri-flower-line:before { content: "\f40a"; }
.ri-glasses-2-fill:before { content: "\f40b"; }
.ri-glasses-2-line:before { content: "\f40c"; }
.ri-glasses-fill:before { content: "\f40d"; }
.ri-glasses-line:before { content: "\f40e"; }
.ri-goggles-fill:before { content: "\f40f"; }
.ri-goggles-line:before { content: "\f410"; }
.ri-image-circle-fill:before { content: "\f411"; }
.ri-image-circle-line:before { content: "\f412"; }
.ri-info-i:before { content: "\f413"; }
.ri-money-rupee-circle-fill:before { content: "\f414"; }
.ri-money-rupee-circle-line:before { content: "\f415"; }
.ri-news-fill:before { content: "\f416"; }
.ri-news-line:before { content: "\f417"; }
.ri-robot-3-fill:before { content: "\f418"; }
.ri-robot-3-line:before { content: "\f419"; }
.ri-share-2-fill:before { content: "\f41a"; }
.ri-share-2-line:before { content: "\f41b"; }
.ri-sofa-fill:before { content: "\f41c"; }
.ri-sofa-line:before { content: "\f41d"; }
.ri-svelte-fill:before { content: "\f41e"; }
.ri-svelte-line:before { content: "\f41f"; }
.ri-vk-fill:before { content: "\f420"; }
.ri-vk-line:before { content: "\f421"; }
.ri-xrp-fill:before { content: "\f422"; }
.ri-xrp-line:before { content: "\f423"; }
.ri-xtz-fill:before { content: "\f424"; }
.ri-xtz-line:before { content: "\f425"; }
.ri-archive-stack-fill:before { content: "\f426"; }
.ri-archive-stack-line:before { content: "\f427"; }
.ri-bowl-fill:before { content: "\f428"; }
.ri-bowl-line:before { content: "\f429"; }
.ri-calendar-view:before { content: "\f42a"; }
.ri-carousel-view:before { content: "\f42b"; }
.ri-code-block:before { content: "\f42c"; }
.ri-color-filter-fill:before { content: "\f42d"; }
.ri-color-filter-line:before { content: "\f42e"; }
.ri-contacts-book-3-fill:before { content: "\f42f"; }
.ri-contacts-book-3-line:before { content: "\f430"; }
.ri-contract-fill:before { content: "\f431"; }
.ri-contract-line:before { content: "\f432"; }
.ri-drinks-2-fill:before { content: "\f433"; }
.ri-drinks-2-line:before { content: "\f434"; }
.ri-export-fill:before { content: "\f435"; }
.ri-export-line:before { content: "\f436"; }
.ri-file-check-fill:before { content: "\f437"; }
.ri-file-check-line:before { content: "\f438"; }
.ri-focus-mode:before { content: "\f439"; }
.ri-folder-6-fill:before { content: "\f43a"; }
.ri-folder-6-line:before { content: "\f43b"; }
.ri-folder-check-fill:before { content: "\f43c"; }
.ri-folder-check-line:before { content: "\f43d"; }
.ri-folder-close-fill:before { content: "\f43e"; }
.ri-folder-close-line:before { content: "\f43f"; }
.ri-folder-cloud-fill:before { content: "\f440"; }
.ri-folder-cloud-line:before { content: "\f441"; }
.ri-gallery-view-2:before { content: "\f442"; }
.ri-gallery-view:before { content: "\f443"; }
.ri-hand:before { content: "\f444"; }
.ri-import-fill:before { content: "\f445"; }
.ri-import-line:before { content: "\f446"; }
.ri-information-2-fill:before { content: "\f447"; }
.ri-information-2-line:before { content: "\f448"; }
.ri-kanban-view-2:before { content: "\f449"; }
.ri-kanban-view:before { content: "\f44a"; }
.ri-list-view:before { content: "\f44b"; }
.ri-lock-star-fill:before { content: "\f44c"; }
.ri-lock-star-line:before { content: "\f44d"; }
.ri-puzzle-2-fill:before { content: "\f44e"; }
.ri-puzzle-2-line:before { content: "\f44f"; }
.ri-puzzle-fill:before { content: "\f450"; }
.ri-puzzle-line:before { content: "\f451"; }
.ri-ram-2-fill:before { content: "\f452"; }
.ri-ram-2-line:before { content: "\f453"; }
.ri-ram-fill:before { content: "\f454"; }
.ri-ram-line:before { content: "\f455"; }
.ri-receipt-fill:before { content: "\f456"; }
.ri-receipt-line:before { content: "\f457"; }
.ri-shadow-fill:before { content: "\f458"; }
.ri-shadow-line:before { content: "\f459"; }
.ri-sidebar-fold-fill:before { content: "\f45a"; }
.ri-sidebar-fold-line:before { content: "\f45b"; }
.ri-sidebar-unfold-fill:before { content: "\f45c"; }
.ri-sidebar-unfold-line:before { content: "\f45d"; }
.ri-slideshow-view:before { content: "\f45e"; }
.ri-sort-alphabet-asc:before { content: "\f45f"; }
.ri-sort-alphabet-desc:before { content: "\f460"; }
.ri-sort-number-asc:before { content: "\f461"; }
.ri-sort-number-desc:before { content: "\f462"; }
.ri-stacked-view:before { content: "\f463"; }
.ri-sticky-note-add-fill:before { content: "\f464"; }
.ri-sticky-note-add-line:before { content: "\f465"; }
.ri-swap-2-fill:before { content: "\f466"; }
.ri-swap-2-line:before { content: "\f467"; }
.ri-swap-3-fill:before { content: "\f468"; }
.ri-swap-3-line:before { content: "\f469"; }
.ri-table-3:before { content: "\f46a"; }
.ri-table-view:before { content: "\f46b"; }
.ri-text-block:before { content: "\f46c"; }
.ri-text-snippet:before { content: "\f46d"; }
.ri-timeline-view:before { content: "\f46e"; }
.ri-blogger-fill:before { content: "\f46f"; }
.ri-blogger-line:before { content: "\f470"; }
.ri-chat-thread-fill:before { content: "\f471"; }
.ri-chat-thread-line:before { content: "\f472"; }
.ri-discount-percent-fill:before { content: "\f473"; }
.ri-discount-percent-line:before { content: "\f474"; }
.ri-exchange-2-fill:before { content: "\f475"; }
.ri-exchange-2-line:before { content: "\f476"; }
.ri-git-fork-fill:before { content: "\f477"; }
.ri-git-fork-line:before { content: "\f478"; }
.ri-input-field:before { content: "\f479"; }
.ri-progress-1-fill:before { content: "\f47a"; }
.ri-progress-1-line:before { content: "\f47b"; }
.ri-progress-2-fill:before { content: "\f47c"; }
.ri-progress-2-line:before { content: "\f47d"; }
.ri-progress-3-fill:before { content: "\f47e"; }
.ri-progress-3-line:before { content: "\f47f"; }
.ri-progress-4-fill:before { content: "\f480"; }
.ri-progress-4-line:before { content: "\f481"; }
.ri-progress-5-fill:before { content: "\f482"; }
.ri-progress-5-line:before { content: "\f483"; }
.ri-progress-6-fill:before { content: "\f484"; }
.ri-progress-6-line:before { content: "\f485"; }
.ri-progress-7-fill:before { content: "\f486"; }
.ri-progress-7-line:before { content: "\f487"; }
.ri-progress-8-fill:before { content: "\f488"; }
.ri-progress-8-line:before { content: "\f489"; }
.ri-remix-run-fill:before { content: "\f48a"; }
.ri-remix-run-line:before { content: "\f48b"; }
.ri-signpost-fill:before { content: "\f48c"; }
.ri-signpost-line:before { content: "\f48d"; }
.ri-time-zone-fill:before { content: "\f48e"; }
.ri-time-zone-line:before { content: "\f48f"; }
.ri-arrow-down-wide-fill:before { content: "\f490"; }
.ri-arrow-down-wide-line:before { content: "\f491"; }
.ri-arrow-left-wide-fill:before { content: "\f492"; }
.ri-arrow-left-wide-line:before { content: "\f493"; }
.ri-arrow-right-wide-fill:before { content: "\f494"; }
.ri-arrow-right-wide-line:before { content: "\f495"; }
.ri-arrow-up-wide-fill:before { content: "\f496"; }
.ri-arrow-up-wide-line:before { content: "\f497"; }
.ri-bluesky-fill:before { content: "\f498"; }
.ri-bluesky-line:before { content: "\f499"; }
.ri-expand-height-fill:before { content: "\f49a"; }
.ri-expand-height-line:before { content: "\f49b"; }
.ri-expand-width-fill:before { content: "\f49c"; }
.ri-expand-width-line:before { content: "\f49d"; }
.ri-forward-end-fill:before { content: "\f49e"; }
.ri-forward-end-line:before { content: "\f49f"; }
.ri-forward-end-mini-fill:before { content: "\f4a0"; }
.ri-forward-end-mini-line:before { content: "\f4a1"; }
.ri-friendica-fill:before { content: "\f4a2"; }
.ri-friendica-line:before { content: "\f4a3"; }
.ri-git-pr-draft-fill:before { content: "\f4a4"; }
.ri-git-pr-draft-line:before { content: "\f4a5"; }
.ri-play-reverse-fill:before { content: "\f4a6"; }
.ri-play-reverse-line:before { content: "\f4a7"; }
.ri-play-reverse-mini-fill:before { content: "\f4a8"; }
.ri-play-reverse-mini-line:before { content: "\f4a9"; }
.ri-rewind-start-fill:before { content: "\f4aa"; }
.ri-rewind-start-line:before { content: "\f4ab"; }
.ri-rewind-start-mini-fill:before { content: "\f4ac"; }
.ri-rewind-start-mini-line:before { content: "\f4ad"; }
.ri-scroll-to-bottom-fill:before { content: "\f4ae"; }
.ri-scroll-to-bottom-line:before { content: "\f4af"; }
.ri-add-large-fill:before { content: "\f4b0"; }
.ri-add-large-line:before { content: "\f4b1"; }
.ri-aed-electrodes-fill:before { content: "\f4b2"; }
.ri-aed-electrodes-line:before { content: "\f4b3"; }
.ri-aed-fill:before { content: "\f4b4"; }
.ri-aed-line:before { content: "\f4b5"; }
.ri-alibaba-cloud-fill:before { content: "\f4b6"; }
.ri-alibaba-cloud-line:before { content: "\f4b7"; }
.ri-align-item-bottom-fill:before { content: "\f4b8"; }
.ri-align-item-bottom-line:before { content: "\f4b9"; }
.ri-align-item-horizontal-center-fill:before { content: "\f4ba"; }
.ri-align-item-horizontal-center-line:before { content: "\f4bb"; }
.ri-align-item-left-fill:before { content: "\f4bc"; }
.ri-align-item-left-line:before { content: "\f4bd"; }
.ri-align-item-right-fill:before { content: "\f4be"; }
.ri-align-item-right-line:before { content: "\f4bf"; }
.ri-align-item-top-fill:before { content: "\f4c0"; }
.ri-align-item-top-line:before { content: "\f4c1"; }
.ri-align-item-vertical-center-fill:before { content: "\f4c2"; }
.ri-align-item-vertical-center-line:before { content: "\f4c3"; }
.ri-apps-2-add-fill:before { content: "\f4c4"; }
.ri-apps-2-add-line:before { content: "\f4c5"; }
.ri-close-large-fill:before { content: "\f4c6"; }
.ri-close-large-line:before { content: "\f4c7"; }
.ri-collapse-diagonal-2-fill:before { content: "\f4c8"; }
.ri-collapse-diagonal-2-line:before { content: "\f4c9"; }
.ri-collapse-diagonal-fill:before { content: "\f4ca"; }
.ri-collapse-diagonal-line:before { content: "\f4cb"; }
.ri-dashboard-horizontal-fill:before { content: "\f4cc"; }
.ri-dashboard-horizontal-line:before { content: "\f4cd"; }
.ri-expand-diagonal-2-fill:before { content: "\f4ce"; }
.ri-expand-diagonal-2-line:before { content: "\f4cf"; }
.ri-expand-diagonal-fill:before { content: "\f4d0"; }
.ri-expand-diagonal-line:before { content: "\f4d1"; }
.ri-firebase-fill:before { content: "\f4d2"; }
.ri-firebase-line:before { content: "\f4d3"; }
.ri-flip-horizontal-2-fill:before { content: "\f4d4"; }
.ri-flip-horizontal-2-line:before { content: "\f4d5"; }
.ri-flip-horizontal-fill:before { content: "\f4d6"; }
.ri-flip-horizontal-line:before { content: "\f4d7"; }
.ri-flip-vertical-2-fill:before { content: "\f4d8"; }
.ri-flip-vertical-2-line:before { content: "\f4d9"; }
.ri-flip-vertical-fill:before { content: "\f4da"; }
.ri-flip-vertical-line:before { content: "\f4db"; }
.ri-formula:before { content: "\f4dc"; }
.ri-function-add-fill:before { content: "\f4dd"; }
.ri-function-add-line:before { content: "\f4de"; }
.ri-goblet-2-fill:before { content: "\f4df"; }
.ri-goblet-2-line:before { content: "\f4e0"; }
.ri-golf-ball-fill:before { content: "\f4e1"; }
.ri-golf-ball-line:before { content: "\f4e2"; }
.ri-group-3-fill:before { content: "\f4e3"; }
.ri-group-3-line:before { content: "\f4e4"; }
.ri-heart-add-2-fill:before { content: "\f4e5"; }
.ri-heart-add-2-line:before { content: "\f4e6"; }
.ri-id-card-fill:before { content: "\f4e7"; }
.ri-id-card-line:before { content: "\f4e8"; }
.ri-information-off-fill:before { content: "\f4e9"; }
.ri-information-off-line:before { content: "\f4ea"; }
.ri-java-fill:before { content: "\f4eb"; }
.ri-java-line:before { content: "\f4ec"; }
.ri-layout-grid-2-fill:before { content: "\f4ed"; }
.ri-layout-grid-2-line:before { content: "\f4ee"; }
.ri-layout-horizontal-fill:before { content: "\f4ef"; }
.ri-layout-horizontal-line:before { content: "\f4f0"; }
.ri-layout-vertical-fill:before { content: "\f4f1"; }
.ri-layout-vertical-line:before { content: "\f4f2"; }
.ri-menu-fold-2-fill:before { content: "\f4f3"; }
.ri-menu-fold-2-line:before { content: "\f4f4"; }
.ri-menu-fold-3-fill:before { content: "\f4f5"; }
.ri-menu-fold-3-line:before { content: "\f4f6"; }
.ri-menu-fold-4-fill:before { content: "\f4f7"; }
.ri-menu-fold-4-line:before { content: "\f4f8"; }
.ri-menu-unfold-2-fill:before { content: "\f4f9"; }
.ri-menu-unfold-2-line:before { content: "\f4fa"; }
.ri-menu-unfold-3-fill:before { content: "\f4fb"; }
.ri-menu-unfold-3-line:before { content: "\f4fc"; }
.ri-menu-unfold-4-fill:before { content: "\f4fd"; }
.ri-menu-unfold-4-line:before { content: "\f4fe"; }
.ri-mobile-download-fill:before { content: "\f4ff"; }
.ri-mobile-download-line:before { content: "\f500"; }
.ri-nextjs-fill:before { content: "\f501"; }
.ri-nextjs-line:before { content: "\f502"; }
.ri-nodejs-fill:before { content: "\f503"; }
.ri-nodejs-line:before { content: "\f504"; }
.ri-pause-large-fill:before { content: "\f505"; }
.ri-pause-large-line:before { content: "\f506"; }
.ri-play-large-fill:before { content: "\f507"; }
.ri-play-large-line:before { content: "\f508"; }
.ri-play-reverse-large-fill:before { content: "\f509"; }
.ri-play-reverse-large-line:before { content: "\f50a"; }
.ri-police-badge-fill:before { content: "\f50b"; }
.ri-police-badge-line:before { content: "\f50c"; }
.ri-prohibited-2-fill:before { content: "\f50d"; }
.ri-prohibited-2-line:before { content: "\f50e"; }
.ri-shopping-bag-4-fill:before { content: "\f50f"; }
.ri-shopping-bag-4-line:before { content: "\f510"; }
.ri-snowflake-fill:before { content: "\f511"; }
.ri-snowflake-line:before { content: "\f512"; }
.ri-square-root:before { content: "\f513"; }
.ri-stop-large-fill:before { content: "\f514"; }
.ri-stop-large-line:before { content: "\f515"; }
.ri-tailwind-css-fill:before { content: "\f516"; }
.ri-tailwind-css-line:before { content: "\f517"; }
.ri-tooth-fill:before { content: "\f518"; }
.ri-tooth-line:before { content: "\f519"; }
.ri-video-off-fill:before { content: "\f51a"; }
.ri-video-off-line:before { content: "\f51b"; }
.ri-video-on-fill:before { content: "\f51c"; }
.ri-video-on-line:before { content: "\f51d"; }
.ri-webhook-fill:before { content: "\f51e"; }
.ri-webhook-line:before { content: "\f51f"; }
.ri-weight-fill:before { content: "\f520"; }
.ri-weight-line:before { content: "\f521"; }
.ri-book-shelf-fill:before { content: "\f522"; }
.ri-book-shelf-line:before { content: "\f523"; }
.ri-brain-2-fill:before { content: "\f524"; }
.ri-brain-2-line:before { content: "\f525"; }
.ri-chat-search-fill:before { content: "\f526"; }
.ri-chat-search-line:before { content: "\f527"; }
.ri-chat-unread-fill:before { content: "\f528"; }
.ri-chat-unread-line:before { content: "\f529"; }
.ri-collapse-horizontal-fill:before { content: "\f52a"; }
.ri-collapse-horizontal-line:before { content: "\f52b"; }
.ri-collapse-vertical-fill:before { content: "\f52c"; }
.ri-collapse-vertical-line:before { content: "\f52d"; }
.ri-dna-fill:before { content: "\f52e"; }
.ri-dna-line:before { content: "\f52f"; }
.ri-dropper-fill:before { content: "\f530"; }
.ri-dropper-line:before { content: "\f531"; }
.ri-expand-diagonal-s-2-fill:before { content: "\f532"; }
.ri-expand-diagonal-s-2-line:before { content: "\f533"; }
.ri-expand-diagonal-s-fill:before { content: "\f534"; }
.ri-expand-diagonal-s-line:before { content: "\f535"; }
.ri-expand-horizontal-fill:before { content: "\f536"; }
.ri-expand-horizontal-line:before { content: "\f537"; }
.ri-expand-horizontal-s-fill:before { content: "\f538"; }
.ri-expand-horizontal-s-line:before { content: "\f539"; }
.ri-expand-vertical-fill:before { content: "\f53a"; }
.ri-expand-vertical-line:before { content: "\f53b"; }
.ri-expand-vertical-s-fill:before { content: "\f53c"; }
.ri-expand-vertical-s-line:before { content: "\f53d"; }
.ri-gemini-fill:before { content: "\f53e"; }
.ri-gemini-line:before { content: "\f53f"; }
.ri-reset-left-fill:before { content: "\f540"; }
.ri-reset-left-line:before { content: "\f541"; }
.ri-reset-right-fill:before { content: "\f542"; }
.ri-reset-right-line:before { content: "\f543"; }
.ri-stairs-fill:before { content: "\f544"; }
.ri-stairs-line:before { content: "\f545"; }
.ri-telegram-2-fill:before { content: "\f546"; }
.ri-telegram-2-line:before { content: "\f547"; }
.ri-triangular-flag-fill:before { content: "\f548"; }
.ri-triangular-flag-line:before { content: "\f549"; }
.ri-user-minus-fill:before { content: "\f54a"; }
.ri-user-minus-line:before { content: "\f54b"; }
.ri-account-box-2-fill:before { content: "\f54c"; }
.ri-account-box-2-line:before { content: "\f54d"; }
.ri-account-circle-2-fill:before { content: "\f54e"; }
.ri-account-circle-2-line:before { content: "\f54f"; }
.ri-alarm-snooze-fill:before { content: "\f550"; }
.ri-alarm-snooze-line:before { content: "\f551"; }
.ri-arrow-down-box-fill:before { content: "\f552"; }
.ri-arrow-down-box-line:before { content: "\f553"; }
.ri-arrow-left-box-fill:before { content: "\f554"; }
.ri-arrow-left-box-line:before { content: "\f555"; }
.ri-arrow-left-down-box-fill:before { content: "\f556"; }
.ri-arrow-left-down-box-line:before { content: "\f557"; }
.ri-arrow-left-up-box-fill:before { content: "\f558"; }
.ri-arrow-left-up-box-line:before { content: "\f559"; }
.ri-arrow-right-box-fill:before { content: "\f55a"; }
.ri-arrow-right-box-line:before { content: "\f55b"; }
.ri-arrow-right-down-box-fill:before { content: "\f55c"; }
.ri-arrow-right-down-box-line:before { content: "\f55d"; }
.ri-arrow-right-up-box-fill:before { content: "\f55e"; }
.ri-arrow-right-up-box-line:before { content: "\f55f"; }
.ri-arrow-up-box-fill:before { content: "\f560"; }
.ri-arrow-up-box-line:before { content: "\f561"; }
.ri-bar-chart-box-ai-fill:before { content: "\f562"; }
.ri-bar-chart-box-ai-line:before { content: "\f563"; }
.ri-brush-ai-fill:before { content: "\f564"; }
.ri-brush-ai-line:before { content: "\f565"; }
.ri-camera-ai-fill:before { content: "\f566"; }
.ri-camera-ai-line:before { content: "\f567"; }
.ri-chat-ai-fill:before { content: "\f568"; }
.ri-chat-ai-line:before { content: "\f569"; }
.ri-chat-smile-ai-fill:before { content: "\f56a"; }
.ri-chat-smile-ai-line:before { content: "\f56b"; }
.ri-chat-voice-ai-fill:before { content: "\f56c"; }
.ri-chat-voice-ai-line:before { content: "\f56d"; }
.ri-code-ai-fill:before { content: "\f56e"; }
.ri-code-ai-line:before { content: "\f56f"; }
.ri-color-filter-ai-fill:before { content: "\f570"; }
.ri-color-filter-ai-line:before { content: "\f571"; }
.ri-custom-size:before { content: "\f572"; }
.ri-fediverse-fill:before { content: "\f573"; }
.ri-fediverse-line:before { content: "\f574"; }
.ri-flag-off-fill:before { content: "\f575"; }
.ri-flag-off-line:before { content: "\f576"; }
.ri-home-9-fill:before { content: "\f577"; }
.ri-home-9-line:before { content: "\f578"; }
.ri-image-ai-fill:before { content: "\f579"; }
.ri-image-ai-line:before { content: "\f57a"; }
.ri-image-circle-ai-fill:before { content: "\f57b"; }
.ri-image-circle-ai-line:before { content: "\f57c"; }
.ri-info-card-fill:before { content: "\f57d"; }
.ri-info-card-line:before { content: "\f57e"; }
.ri-landscape-ai-fill:before { content: "\f57f"; }
.ri-landscape-ai-line:before { content: "\f580"; }
.ri-letter-spacing-2:before { content: "\f581"; }
.ri-line-height-2:before { content: "\f582"; }
.ri-mail-ai-fill:before { content: "\f583"; }
.ri-mail-ai-line:before { content: "\f584"; }
.ri-mic-2-ai-fill:before { content: "\f585"; }
.ri-mic-2-ai-line:before { content: "\f586"; }
.ri-mic-ai-fill:before { content: "\f587"; }
.ri-mic-ai-line:before { content: "\f588"; }
.ri-movie-ai-fill:before { content: "\f589"; }
.ri-movie-ai-line:before { content: "\f58a"; }
.ri-music-ai-fill:before { content: "\f58b"; }
.ri-music-ai-line:before { content: "\f58c"; }
.ri-notification-snooze-fill:before { content: "\f58d"; }
.ri-notification-snooze-line:before { content: "\f58e"; }
.ri-php-fill:before { content: "\f58f"; }
.ri-php-line:before { content: "\f590"; }
.ri-pix-fill:before { content: "\f591"; }
.ri-pix-line:before { content: "\f592"; }
.ri-pulse-ai-fill:before { content: "\f593"; }
.ri-pulse-ai-line:before { content: "\f594"; }
.ri-quill-pen-ai-fill:before { content: "\f595"; }
.ri-quill-pen-ai-line:before { content: "\f596"; }
.ri-speak-ai-fill:before { content: "\f597"; }
.ri-speak-ai-line:before { content: "\f598"; }
.ri-star-off-fill:before { content: "\f599"; }
.ri-star-off-line:before { content: "\f59a"; }
.ri-translate-ai-2:before { content: "\f59b"; }
.ri-translate-ai:before { content: "\f59c"; }
.ri-user-community-fill:before { content: "\f59d"; }
.ri-user-community-line:before { content: "\f59e"; }
.ri-vercel-fill:before { content: "\f59f"; }
.ri-vercel-line:before { content: "\f5a0"; }
.ri-video-ai-fill:before { content: "\f5a1"; }
.ri-video-ai-line:before { content: "\f5a2"; }
.ri-video-on-ai-fill:before { content: "\f5a3"; }
.ri-video-on-ai-line:before { content: "\f5a4"; }
.ri-voice-ai-fill:before { content: "\f5a5"; }
.ri-voice-ai-line:before { content: "\f5a6"; }
.ri-ai-generate-2:before { content: "\f5a7"; }
.ri-ai-generate-text:before { content: "\f5a8"; }
.ri-anthropic-fill:before { content: "\f5a9"; }
.ri-anthropic-line:before { content: "\f5aa"; }
.ri-apps-2-ai-fill:before { content: "\f5ab"; }
.ri-apps-2-ai-line:before { content: "\f5ac"; }
.ri-camera-lens-ai-fill:before { content: "\f5ad"; }
.ri-camera-lens-ai-line:before { content: "\f5ae"; }
.ri-clapperboard-ai-fill:before { content: "\f5af"; }
.ri-clapperboard-ai-line:before { content: "\f5b0"; }
.ri-claude-fill:before { content: "\f5b1"; }
.ri-claude-line:before { content: "\f5b2"; }
.ri-closed-captioning-ai-fill:before { content: "\f5b3"; }
.ri-closed-captioning-ai-line:before { content: "\f5b4"; }
.ri-dvd-ai-fill:before { content: "\f5b5"; }
.ri-dvd-ai-line:before { content: "\f5b6"; }
.ri-film-ai-fill:before { content: "\f5b7"; }
.ri-film-ai-line:before { content: "\f5b8"; }
.ri-font-size-ai:before { content: "\f5b9"; }
.ri-mixtral-fill:before { content: "\f5ba"; }
.ri-mixtral-line:before { content: "\f5bb"; }
.ri-movie-2-ai-fill:before { content: "\f5bc"; }
.ri-movie-2-ai-line:before { content: "\f5bd"; }
.ri-mv-ai-fill:before { content: "\f5be"; }
.ri-mv-ai-line:before { content: "\f5bf"; }
.ri-perplexity-fill:before { content: "\f5c0"; }
.ri-perplexity-line:before { content: "\f5c1"; }
.ri-poker-clubs-fill:before { content: "\f5c2"; }
.ri-poker-clubs-line:before { content: "\f5c3"; }
.ri-poker-diamonds-fill:before { content: "\f5c4"; }
.ri-poker-diamonds-line:before { content: "\f5c5"; }
.ri-poker-hearts-fill:before { content: "\f5c6"; }
.ri-poker-hearts-line:before { content: "\f5c7"; }
.ri-poker-spades-fill:before { content: "\f5c8"; }
.ri-poker-spades-line:before { content: "\f5c9"; }
.ri-safe-3-fill:before { content: "\f5ca"; }
.ri-safe-3-line:before { content: "\f5cb"; }
.ri-accessibility-fill:before { content: "\f5cc"; }
.ri-accessibility-line:before { content: "\f5cd"; }
.ri-alarm-add-fill:before { content: "\f5ce"; }
.ri-alarm-add-line:before { content: "\f5cf"; }
.ri-arrow-down-long-fill:before { content: "\f5d0"; }
.ri-arrow-down-long-line:before { content: "\f5d1"; }
.ri-arrow-left-down-long-fill:before { content: "\f5d2"; }
.ri-arrow-left-down-long-line:before { content: "\f5d3"; }
.ri-arrow-left-long-fill:before { content: "\f5d4"; }
.ri-arrow-left-long-line:before { content: "\f5d5"; }
.ri-arrow-left-up-long-fill:before { content: "\f5d6"; }
.ri-arrow-left-up-long-line:before { content: "\f5d7"; }
.ri-arrow-right-down-long-fill:before { content: "\f5d8"; }
.ri-arrow-right-down-long-line:before { content: "\f5d9"; }
.ri-arrow-right-long-fill:before { content: "\f5da"; }
.ri-arrow-right-long-line:before { content: "\f5db"; }
.ri-arrow-right-up-long-fill:before { content: "\f5dc"; }
.ri-arrow-right-up-long-line:before { content: "\f5dd"; }
.ri-arrow-up-long-fill:before { content: "\f5de"; }
.ri-arrow-up-long-line:before { content: "\f5df"; }
.ri-chess-fill:before { content: "\f5e0"; }
.ri-chess-line:before { content: "\f5e1"; }
.ri-diamond-fill:before { content: "\f5e2"; }
.ri-diamond-line:before { content: "\f5e3"; }
.ri-diamond-ring-fill:before { content: "\f5e4"; }
.ri-diamond-ring-line:before { content: "\f5e5"; }
.ri-figma-fill:before { content: "\f5e6"; }
.ri-figma-line:before { content: "\f5e7"; }
.ri-firefox-browser-fill:before { content: "\f5e8"; }
.ri-firefox-browser-line:before { content: "\f5e9"; }
.ri-jewelry-fill:before { content: "\f5ea"; }
.ri-jewelry-line:before { content: "\f5eb"; }
.ri-multi-image-fill:before { content: "\f5ec"; }
.ri-multi-image-line:before { content: "\f5ed"; }
.ri-no-credit-card-fill:before { content: "\f5ee"; }
.ri-no-credit-card-line:before { content: "\f5ef"; }
.ri-service-bell-fill:before { content: "\f5f0"; }
.ri-service-bell-line:before { content: "\f5f1"; }
.ri-ai-agent-fill:before { content: "\f5f2"; }
.ri-ai-agent-line:before { content: "\f5f3"; }
.ri-ai-generate-2-fill:before { content: "\f5f4"; }
.ri-ai-generate-2-line:before { content: "\f5f5"; }
.ri-ai-generate-3d-fill:before { content: "\f5f6"; }
.ri-ai-generate-3d-line:before { content: "\f5f7"; }
.ri-ai:before { content: "\f5f8"; }
.ri-apps-ai-fill:before { content: "\f5f9"; }
.ri-apps-ai-line:before { content: "\f5fa"; }
.ri-atom-fill:before { content: "\f5fb"; }
.ri-atom-line:before { content: "\f5fc"; }
.ri-book-ai-fill:before { content: "\f5fd"; }
.ri-book-ai-line:before { content: "\f5fe"; }
.ri-brain-3-fill:before { content: "\f5ff"; }
.ri-brain-3-line:before { content: "\f600"; }
.ri-brain-ai-3-fill:before { content: "\f601"; }
.ri-brain-ai-3-line:before { content: "\f602"; }
.ri-brush-ai-3-fill:before { content: "\f603"; }
.ri-brush-ai-3-line:before { content: "\f604"; }
.ri-camera-4-fill:before { content: "\f605"; }
.ri-camera-4-line:before { content: "\f606"; }
.ri-camera-ai-2-fill:before { content: "\f607"; }
.ri-camera-ai-2-line:before { content: "\f608"; }
.ri-chat-ai-2-fill:before { content: "\f609"; }
.ri-chat-ai-2-line:before { content: "\f60a"; }
.ri-chat-ai-3-fill:before { content: "\f60b"; }
.ri-chat-ai-3-line:before { content: "\f60c"; }
.ri-chat-ai-4-fill:before { content: "\f60d"; }
.ri-chat-ai-4-line:before { content: "\f60e"; }
.ri-chat-smile-ai-3-fill:before { content: "\f60f"; }
.ri-chat-smile-ai-3-line:before { content: "\f610"; }
.ri-deepseek-fill:before { content: "\f611"; }
.ri-deepseek-line:before { content: "\f612"; }
.ri-file-ai-2-fill:before { content: "\f613"; }
.ri-file-ai-2-line:before { content: "\f614"; }
.ri-file-ai-fill:before { content: "\f615"; }
.ri-file-ai-line:before { content: "\f616"; }
.ri-function-ai-fill:before { content: "\f617"; }
.ri-function-ai-line:before { content: "\f618"; }
.ri-game-2-fill:before { content: "\f619"; }
.ri-game-2-line:before { content: "\f61a"; }
.ri-goblet-broken-fill:before { content: "\f61b"; }
.ri-goblet-broken-line:before { content: "\f61c"; }
.ri-lightbulb-ai-fill:before { content: "\f61d"; }
.ri-lightbulb-ai-line:before { content: "\f61e"; }
.ri-loop-left-ai-fill:before { content: "\f61f"; }
.ri-loop-left-ai-line:before { content: "\f620"; }
.ri-loop-right-ai-fill:before { content: "\f621"; }
.ri-loop-right-ai-line:before { content: "\f622"; }
.ri-message-ai-3-fill:before { content: "\f623"; }
.ri-message-ai-3-line:before { content: "\f624"; }
.ri-painting-ai-fill:before { content: "\f625"; }
.ri-painting-ai-line:before { content: "\f626"; }
.ri-painting-fill:before { content: "\f627"; }
.ri-painting-line:before { content: "\f628"; }
.ri-pencil-ai-2-fill:before { content: "\f629"; }
.ri-pencil-ai-2-line:before { content: "\f62a"; }
.ri-pencil-ai-fill:before { content: "\f62b"; }
.ri-pencil-ai-line:before { content: "\f62c"; }
.ri-remix-fill:before { content: "\f62d"; }
.ri-remix-line:before { content: "\f62e"; }
.ri-search-ai-2-fill:before { content: "\f62f"; }
.ri-search-ai-2-line:before { content: "\f630"; }
.ri-search-ai-3-fill:before { content: "\f631"; }
.ri-search-ai-3-line:before { content: "\f632"; }
.ri-search-ai-4-fill:before { content: "\f633"; }
.ri-search-ai-4-line:before { content: "\f634"; }
.ri-search-ai-fill:before { content: "\f635"; }
.ri-search-ai-line:before { content: "\f636"; }
.ri-speech-to-text-fill:before { content: "\f637"; }
.ri-speech-to-text-line:before { content: "\f638"; }
.ri-target-fill:before { content: "\f639"; }
.ri-target-line:before { content: "\f63a"; }
.ri-text-to-speech-fill:before { content: "\f63b"; }
.ri-text-to-speech-line:before { content: "\f63c"; }
.ri-wrench-fill:before { content: "\f63d"; }
.ri-wrench-line:before { content: "\f63e"; }
.ri-area-chart-fill:before { content: "\f63f"; }
.ri-area-chart-line:before { content: "\f640"; }
.ri-baseball-fill:before { content: "\f641"; }
.ri-baseball-line:before { content: "\f642"; }
.ri-binoculars-fill:before { content: "\f643"; }
.ri-binoculars-line:before { content: "\f644"; }
.ri-cursor-hand:before { content: "\f645"; }
.ri-emotion-add-fill:before { content: "\f646"; }
.ri-emotion-add-line:before { content: "\f647"; }
.ri-file-scan-fill:before { content: "\f648"; }
.ri-file-scan-line:before { content: "\f649"; }
.ri-fiverr-fill:before { content: "\f64a"; }
.ri-fiverr-line:before { content: "\f64b"; }
.ri-font-serif:before { content: "\f64c"; }
.ri-ghost-3-fill:before { content: "\f64d"; }
.ri-ghost-3-line:before { content: "\f64e"; }
.ri-gitee-fill:before { content: "\f64f"; }
.ri-gitee-line:before { content: "\f650"; }
.ri-global-off-fill:before { content: "\f651"; }
.ri-global-off-line:before { content: "\f652"; }
.ri-image-download-fill:before { content: "\f653"; }
.ri-image-download-line:before { content: "\f654"; }
.ri-image-upload-fill:before { content: "\f655"; }
.ri-image-upload-line:before { content: "\f656"; }
.ri-issues-fill:before { content: "\f657"; }
.ri-issues-line:before { content: "\f658"; }
.ri-issues-reopen-fill:before { content: "\f659"; }
.ri-issues-reopen-line:before { content: "\f65a"; }
.ri-network-error-fill:before { content: "\f65b"; }
.ri-network-error-line:before { content: "\f65c"; }
.ri-network-fill:before { content: "\f65d"; }
.ri-network-line:before { content: "\f65e"; }
.ri-network-off-fill:before { content: "\f65f"; }
.ri-network-off-line:before { content: "\f660"; }
.ri-piano-fill:before { content: "\f661"; }
.ri-piano-grand-fill:before { content: "\f662"; }
.ri-piano-grand-line:before { content: "\f663"; }
.ri-piano-line:before { content: "\f664"; }
.ri-plug-3-fill:before { content: "\f665"; }
.ri-plug-3-line:before { content: "\f666"; }
.ri-send-ins-fill:before { content: "\f667"; }
.ri-send-ins-line:before { content: "\f668"; }
.ri-signal-cellular-1-fill:before { content: "\f669"; }
.ri-signal-cellular-1-line:before { content: "\f66a"; }
.ri-signal-cellular-2-fill:before { content: "\f66b"; }
.ri-signal-cellular-2-line:before { content: "\f66c"; }
.ri-signal-cellular-3-fill:before { content: "\f66d"; }
.ri-signal-cellular-3-line:before { content: "\f66e"; }
.ri-signal-cellular-off-fill:before { content: "\f66f"; }
.ri-signal-cellular-off-line:before { content: "\f670"; }
.ri-stacked-chart-fill:before { content: "\f671"; }
.ri-stacked-chart-line:before { content: "\f672"; }
.ri-upwork-fill:before { content: "\f673"; }
.ri-upwork-line:before { content: "\f674"; }
.ri-brain-4-fill:before { content: "\f675"; }
.ri-brain-4-line:before { content: "\f676"; }
.ri-certificate-2-fill:before { content: "\f677"; }
.ri-certificate-2-line:before { content: "\f678"; }
.ri-certificate-fill:before { content: "\f679"; }
.ri-certificate-line:before { content: "\f67a"; }
.ri-cookie-fill:before { content: "\f67b"; }
.ri-cookie-line:before { content: "\f67c"; }
.ri-cursor-ai-fill:before { content: "\f67d"; }
.ri-cursor-ai-line:before { content: "\f67e"; }
.ri-draw-fill:before { content: "\f67f"; }
.ri-draw-line:before { content: "\f680"; }
.ri-ghost-4-fill:before { content: "\f681"; }
.ri-ghost-4-line:before { content: "\f682"; }
.ri-gitbook-fill:before { content: "\f683"; }
.ri-gitbook-line:before { content: "\f684"; }
.ri-grok-ai-fill:before { content: "\f685"; }
.ri-grok-ai-line:before { content: "\f686"; }
.ri-hand-2:before { content: "\f687"; }
.ri-megaphone-2-fill:before { content: "\f688"; }
.ri-megaphone-2-line:before { content: "\f689"; }
.ri-microsoft-copilot-fill:before { content: "\f68a"; }
.ri-microsoft-copilot-line:before { content: "\f68b"; }
.ri-mosaic-fill:before { content: "\f68c"; }
.ri-mosaic-line:before { content: "\f68d"; }
.ri-qr-scan-ai-fill:before { content: "\f68e"; }
.ri-qr-scan-ai-line:before { content: "\f68f"; }
.ri-qwen-ai-fill:before { content: "\f690"; }
.ri-qwen-ai-line:before { content: "\f691"; }
.ri-reddit-2-fill:before { content: "\f692"; }
.ri-reddit-2-line:before { content: "\f693"; }
.ri-sim-card-warning-fill:before { content: "\f694"; }
.ri-sim-card-warning-line:before { content: "\f695"; }
.ri-space-ship-2-fill:before { content: "\f696"; }
.ri-space-ship-2-line:before { content: "\f697"; }
.ri-subreddit-fill:before { content: "\f698"; }
.ri-subreddit-line:before { content: "\f699"; }
.ri-zhipu-ai-fill:before { content: "\f69a"; }
.ri-zhipu-ai-line:before { content: "\f69b"; }
.ri-connector-fill:before { content: "\f69c"; }
.ri-connector-line:before { content: "\f69d"; }


/* inter-cyrillic-ext-300-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 300;
  src: url(/inter-cyrillic-ext-300-normal.ce3aca2d.woff2) format('woff2'), url(/inter-cyrillic-ext-300-normal.d1756134.woff) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* inter-cyrillic-300-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 300;
  src: url(/inter-cyrillic-300-normal.68ac052d.woff2) format('woff2'), url(/inter-cyrillic-300-normal.80486695.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* inter-greek-ext-300-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 300;
  src: url(/inter-greek-ext-300-normal.f600629d.woff2) format('woff2'), url(/inter-greek-ext-300-normal.47ca5453.woff) format('woff');
  unicode-range: U+1F00-1FFF;
}

/* inter-greek-300-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 300;
  src: url(/inter-greek-300-normal.1fddabee.woff2) format('woff2'), url(/inter-greek-300-normal.5929bf84.woff) format('woff');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* inter-vietnamese-300-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 300;
  src: url(/inter-vietnamese-300-normal.2095005e.woff2) format('woff2'), url(/inter-vietnamese-300-normal.2fdc30d3.woff) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* inter-latin-ext-300-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 300;
  src: url(/inter-latin-ext-300-normal.b32f92ec.woff2) format('woff2'), url(/inter-latin-ext-300-normal.6435d64c.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* inter-latin-300-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 300;
  src: url(/inter-latin-300-normal.4ac82a8c.woff2) format('woff2'), url(/inter-latin-300-normal.7f075767.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* inter-cyrillic-ext-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/inter-cyrillic-ext-400-normal.5d067369.woff2) format('woff2'), url(/inter-cyrillic-ext-400-normal.04e304d7.woff) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* inter-cyrillic-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/inter-cyrillic-400-normal.db668da6.woff2) format('woff2'), url(/inter-cyrillic-400-normal.146821e2.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* inter-greek-ext-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/inter-greek-ext-400-normal.c1153ef1.woff2) format('woff2'), url(/inter-greek-ext-400-normal.1b7184b8.woff) format('woff');
  unicode-range: U+1F00-1FFF;
}

/* inter-greek-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/inter-greek-400-normal.4ff0e7d9.woff2) format('woff2'), url(/inter-greek-400-normal.e1fbdafb.woff) format('woff');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* inter-vietnamese-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/inter-vietnamese-400-normal.3d93dab9.woff2) format('woff2'), url(/inter-vietnamese-400-normal.6ddf460c.woff) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* inter-latin-ext-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/inter-latin-ext-400-normal.c2f1866d.woff2) format('woff2'), url(/inter-latin-ext-400-normal.f2354be4.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* inter-latin-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/inter-latin-400-normal.8e5d36aa.woff2) format('woff2'), url(/inter-latin-400-normal.25604526.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* inter-cyrillic-ext-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/inter-cyrillic-ext-500-normal.c1d10651.woff2) format('woff2'), url(/inter-cyrillic-ext-500-normal.9e27a0a4.woff) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* inter-cyrillic-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/inter-cyrillic-500-normal.e590af46.woff2) format('woff2'), url(/inter-cyrillic-500-normal.768ce147.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* inter-greek-ext-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/inter-greek-ext-500-normal.769b58c4.woff2) format('woff2'), url(/inter-greek-ext-500-normal.29bb5d6d.woff) format('woff');
  unicode-range: U+1F00-1FFF;
}

/* inter-greek-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/inter-greek-500-normal.72def4f0.woff2) format('woff2'), url(/inter-greek-500-normal.f4846f50.woff) format('woff');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* inter-vietnamese-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/inter-vietnamese-500-normal.d45fc0ae.woff2) format('woff2'), url(/inter-vietnamese-500-normal.0eaa9b30.woff) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* inter-latin-ext-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/inter-latin-ext-500-normal.6c9deab9.woff2) format('woff2'), url(/inter-latin-ext-500-normal.934cad80.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* inter-latin-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/inter-latin-500-normal.cced7c71.woff2) format('woff2'), url(/inter-latin-500-normal.8e06b8e1.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* inter-cyrillic-ext-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/inter-cyrillic-ext-600-normal.c7dc3d23.woff2) format('woff2'), url(/inter-cyrillic-ext-600-normal.57272c30.woff) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* inter-cyrillic-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/inter-cyrillic-600-normal.86c3a36d.woff2) format('woff2'), url(/inter-cyrillic-600-normal.f4b6c101.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* inter-greek-ext-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/inter-greek-ext-600-normal.11eb5abf.woff2) format('woff2'), url(/inter-greek-ext-600-normal.0d595562.woff) format('woff');
  unicode-range: U+1F00-1FFF;
}

/* inter-greek-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/inter-greek-600-normal.78480e7f.woff2) format('woff2'), url(/inter-greek-600-normal.86a89c64.woff) format('woff');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* inter-vietnamese-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/inter-vietnamese-600-normal.defcb257.woff2) format('woff2'), url(/inter-vietnamese-600-normal.668df1e5.woff) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* inter-latin-ext-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/inter-latin-ext-600-normal.02151d1b.woff2) format('woff2'), url(/inter-latin-ext-600-normal.65ca1762.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* inter-latin-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/inter-latin-600-normal.c50ac62d.woff2) format('woff2'), url(/inter-latin-600-normal.08103aa6.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* roboto-mono-cyrillic-ext-400-normal */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/roboto-mono-cyrillic-ext-400-normal.52b7c1da.woff2) format('woff2'), url(/roboto-mono-cyrillic-ext-400-normal.bf4b34e7.woff) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* roboto-mono-cyrillic-400-normal */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/roboto-mono-cyrillic-400-normal.090a1e34.woff2) format('woff2'), url(/roboto-mono-cyrillic-400-normal.b624e6c6.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* roboto-mono-greek-400-normal */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/roboto-mono-greek-400-normal.6926bd0a.woff2) format('woff2'), url(/roboto-mono-greek-400-normal.4166f07c.woff) format('woff');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* roboto-mono-vietnamese-400-normal */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/roboto-mono-vietnamese-400-normal.a10596bc.woff2) format('woff2'), url(/roboto-mono-vietnamese-400-normal.fd90c3b9.woff) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* roboto-mono-latin-ext-400-normal */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/roboto-mono-latin-ext-400-normal.9272e172.woff2) format('woff2'), url(/roboto-mono-latin-ext-400-normal.1973f67e.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* roboto-mono-latin-400-normal */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/roboto-mono-latin-400-normal.3c4f31cc.woff2) format('woff2'), url(/roboto-mono-latin-400-normal.72125140.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* 全局样式 */
:root {
  /* Landing-cover visual language shared by internal pages */
  --hm-blue: #1a73e8;
  --hm-blue-strong: #0b57d0;
  --hm-indigo: #635bff;
  --hm-ink: #202124;
  --hm-muted: #687078;
  --hm-line: #e1e7ef;
  --hm-soft: #f7f9fc;
  --hm-panel: rgba(255, 255, 255, 0.92);
  --hm-shadow-sm: 0 4px 16px rgba(37, 55, 84, 0.07);
  --hm-shadow-md: 0 16px 42px rgba(37, 55, 84, 0.1);
  --hm-radius: 18px;
  --hm-radius-lg: 24px;
  --primary-color: #ffffff;
  --secondary-color: #f0f4f9;
  --accent-color: #1a73e8;
  --accent-hover: #1557b0;
  --accent-glow: rgba(26, 115, 232, 0.15);
  --light-gray: #e3e3e3;
  --dark-gray: #f8fafd;
  --text-color: #1f1f1f;
  --text-secondary: #5f6368;
  --shadow-color: rgba(0, 0, 0, 0.05);
  --shadow-strong: rgba(0, 0, 0, 0.1);
  --background-gradient: linear-gradient(
    145deg,
    #f8fafd 0%,
    #ffffff 100%
  );
  --error-color: #d93025;
  --success-color: #188038;
  --card-radius: 12px;
  --transition-fast: 0.2s ease;
  --transition-normal: 0.3s ease;
  --content-width: 1200px;
  --tech-line-color: rgba(26, 115, 232, 0.12);
  --tech-dot-color: rgba(26, 115, 232, 0.5);
  --border-color: #dadce0;
  --hover-color: rgba(60, 64, 67, 0.08);

  /* Glassmorphism & Adaptive Theme Variables - Permanent Light Mode */
  --glass-background: rgba(255, 255, 255, 0.85);
  --glass-border: rgba(0, 0, 0, 0.08);
  --glass-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
  --glass-shadow-strong: 0 8px 30px rgba(0, 0, 0, 0.08);
  --glass-text: #1f1f1f;
  --input-bg: #f0f4f9;
  --input-border: rgba(0, 0, 0, 0.05);
  --input-focus-bg: #ffffff;
  --input-btn-color: #5f6368;
  --input-placeholder-color: #757575;
  --card-background: #ffffff;
  --shadow-glow: rgba(26, 115, 232, 0.15);

  /* Petal & Submit Button Theme Variables - Permanent Light Mode */
  --petal-bg: rgba(255, 255, 255, 0.95);
  --petal-border: rgba(26, 115, 232, 0.2);
  --petal-color: #1f1f1f;
  --petal-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
  --petal-active-bg: rgba(26, 115, 232, 0.12);
  --petal-active-border: var(--accent-color);
  --petal-active-color: var(--accent-color);
  --petal-active-shadow: 0 0 12px var(--accent-glow);

  --submit-disabled-bg: #e8eaed;
  --submit-disabled-border: rgba(0, 0, 0, 0.05);
  --submit-disabled-color: #9aa0a6;
}

/* Light Theme Variables - Gemini-inspired Modern and Clean Style */
:root[data-theme='light'],
body.light-theme {
  --primary-color: #ffffff;
  --secondary-color: #f0f4f9;
  --accent-color: #1a73e8;
  --accent-hover: #1557b0;
  --accent-glow: rgba(26, 115, 232, 0.15);
  --light-gray: #e3e3e3;
  --dark-gray: #f8fafd;
  --text-color: #1f1f1f;
  --text-secondary: #5f6368;
  --shadow-color: rgba(0, 0, 0, 0.05);
  --shadow-strong: rgba(0, 0, 0, 0.1);
  --background-gradient: linear-gradient(
    145deg,
    #f8fafd 0%,
    #ffffff 100%
  );
  --error-color: #d93025;
  --success-color: #188038;
  --border-color: #dadce0;
  --hover-color: rgba(60, 64, 67, 0.08);
  --tech-line-color: rgba(26, 115, 232, 0.12);
  --tech-dot-color: rgba(26, 115, 232, 0.5);

  /* Glassmorphism & Adaptive Theme Variables - Light Mode */
  --glass-background: rgba(255, 255, 255, 0.85);
  --glass-border: rgba(0, 0, 0, 0.08);
  --glass-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
  --glass-shadow-strong: 0 8px 30px rgba(0, 0, 0, 0.08);
  --glass-text: #1f1f1f;
  --input-bg: #f0f4f9;
  --input-border: rgba(0, 0, 0, 0.05);
  --input-focus-bg: #ffffff;
  --input-btn-color: #5f6368;
  --input-placeholder-color: #757575;
  --card-background: #ffffff;
  --shadow-glow: rgba(26, 115, 232, 0.15);

  /* Petal & Submit Button Theme Variables - Light Mode */
  --petal-bg: rgba(255, 255, 255, 0.95);
  --petal-border: rgba(26, 115, 232, 0.2);
  --petal-color: #1f1f1f;
  --petal-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
  --petal-active-bg: rgba(26, 115, 232, 0.12);
  --petal-active-border: var(--accent-color);
  --petal-active-color: var(--accent-color);
  --petal-active-shadow: 0 0 12px var(--accent-glow);

  --submit-disabled-bg: #e8eaed;
  --submit-disabled-border: rgba(0, 0, 0, 0.05);
  --submit-disabled-color: #9aa0a6;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  height: 100%;
  scroll-behavior: smooth;
}

body {
  min-height: 100%;
  width: 100%;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
  background: var(--background-gradient);
  color: var(--text-color);
  overflow-x: hidden;
  font-size: 16px;
  line-height: 1.6;
}

#root {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  position: relative;
  z-index: 1;
}

/* 应用容器 */
.app-container {
  position: relative;
  min-height: 100vh;
  z-index: 1;
}

/* 背景动画样式 */
.math-animation {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
  opacity: 0.3;
  contain: layout style paint;
}

/* 白板全屏模式下隐藏背景漂浮符号，减轻画布渲染压力 */
body:has(.layout-container--board) .math-animation {
  display: none;
}

.math-symbol {
  position: absolute;
  top: 0;
  color: var(--accent-color);
  opacity: 0;
  animation: float 24s linear infinite both;
  z-index: 1;
  will-change: transform, opacity;
  user-select: none;
}

@keyframes float {
  0% {
    transform: translate3d(0, 105vh, 0) rotate(0deg);
    opacity: 0;
  }
  10% {
    opacity: var(--symbol-opacity, 0.4);
  }
  90% {
    opacity: var(--symbol-opacity, 0.4);
  }
  100% {
    transform: translate3d(0, -15vh, 0) rotate(360deg);
    opacity: 0;
  }
}


/* 解题模式专用样式 */
.solve-stream {
  line-height: 1.8;
  font-size: 16px;
  color: var(--text-color, #1f1f1f);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  white-space: normal;
}

.solve-stream h1,
.solve-stream h2,
.solve-stream h3,
.solve-stream h4 {
  color: var(--hm-ink, #202124);
  font-weight: 600;
}

.solve-stream p {
  margin: 1em 0;
  padding: 0;
  color: var(--text-color, #1f1f1f);
}

.solve-stream ul,
.solve-stream ol {
  margin: 1em 0;
  padding-left: 2em;
  color: var(--text-color, #1f1f1f);
}

.solve-stream li {
  margin: 0.5em 0;
  line-height: 1.6;
}

.solve-stream strong {
  color: var(--hm-blue-strong, #0b57d0);
  font-weight: 600;
}

.solve-stream em {
  color: var(--hm-muted, #5f6368);
  font-style: italic;
}

/* 数学公式容器优化 */
.solve-stream .katex-display {
  margin: 1.5em 0;
  text-align: center;
  background: rgba(26, 115, 232, 0.04);
  border-radius: 8px;
  padding: 1em;
  border: 1px solid rgba(26, 115, 232, 0.12);
  border-left: 4px solid var(--accent-color, #1a73e8);
}

.solve-stream .katex {
  font-size: 1.08em;
  color: var(--text-color, #1f1f1f);
}

.solve-stream .katex-error {
  color: #d93025 !important;
  background: rgba(217, 48, 37, 0.08);
  border: 1px dashed rgba(217, 48, 37, 0.4);
  padding: 2px 6px;
  border-radius: 4px;
  font-family: inherit;
  font-size: 0.9em;
  word-break: break-all;
}

/* 步骤列表优化 */
.solve-stream ul li strong {
  display: inline-block;
  margin-bottom: 0.5em;
  color: var(--hm-blue-strong, #0b57d0);
  border-bottom: 1px solid rgba(26, 115, 232, 0.25);
  padding-bottom: 2px;
}

/* 数学错误样式 */
.math-error {
  background: rgba(255, 82, 82, 0.1);
  border: 1px solid rgba(255, 82, 82, 0.3);
  border-radius: 4px;
  padding: 0.25em 0.5em;
  color: #ff9999;
  font-family: "Courier New", monospace;
  font-size: 0.9em;
}

.math-error code {
  background: none;
  color: inherit;
  padding: 0;
}

/* 解题阶段指示器 */
.solve-phase-indicator {
  position: sticky;
  top: 0;
  background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
  border: 1px solid var(--accent-color);
  border-radius: 25px;
  padding: 0.75em 1.5em;
  margin: 1em 0;
  text-align: center;
  font-weight: 600;
  color: var(--accent-color);
  z-index: 10;
  box-shadow: 0 4px 12px rgba(79, 109, 245, 0.2);
  animation: pulse-glow 2s ease-in-out infinite alternate;
}

@keyframes pulse-glow {
  from {
    box-shadow: 0 4px 12px rgba(79, 109, 245, 0.2);
  }
  to {
    box-shadow: 0 4px 20px rgba(79, 109, 245, 0.4);
  }
}

/* 解题模式响应式优化 */
@media (max-width: 768px) {
  .solve-stream {
    font-size: 14px;
    line-height: 1.6;
  }

  .solve-stream .katex-display {
    margin: 1em 0;
    padding: 0.75em;
  }

  .solve-phase-indicator {
    font-size: 14px;
    padding: 0.5em 1em;
  }
}

/* 科技感头部 */
.tech-header {
  padding-left: 0 !important;
  padding-right: 0 !important;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

/* 如果需要为内部内容保留水平边距，可针对 .tech-header > * 设置内边距 */
.tech-header .header-button-container,
.tech-header .title-container {
  padding-left: 2rem;
  padding-right: 2rem;
}

.logo-container {
  position: relative;
  display: inline-block;
  margin-bottom: 1rem;
  margin-top: 0.5rem;
  padding: 0.5rem 1rem;
  animation: logo-breath 6s infinite ease-in-out;
}

@keyframes logo-breath {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.02);
  }
}

.logo-glow {
  display: none !important;
}

/* Logo脉冲效果(已禁用) */
.logo-pulse {
  display: none !important;
}

/* Logo电路效果(已禁用) */
.logo-circuit {
  display: none !important;
}

@keyframes logoPulse {
  0% {
    opacity: 0;
    transform: scale(0.8);
  }
  50% {
    opacity: 0.2;
    transform: scale(1.1);
  }
  100% {
    opacity: 0;
    transform: scale(1.3);
  }
}

@keyframes circuitFlow {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 400px 400px;
  }
}

@keyframes logoGlow {
  0% {
    box-shadow: 0 0 30px 10px var(--accent-glow);
    opacity: 0.45;
  }
  100% {
    box-shadow: 0 0 55px 18px var(--accent-glow);
    opacity: 0.8;
  }
}

.header-decoration {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 1.5rem auto 0.5rem;
  max-width: 400px;
  position: relative;
  display: none; /* 隐藏蓝色分界线 */
}

.header-decoration::before {
  content: "";
  position: absolute;
  top: -10px;
  left: 10%;
  right: 10%;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(79, 109, 245, 0.2),
    transparent
  );
}

.tech-line {
  height: 1px;
  flex-grow: 1;
  background: var(--tech-line-color);
}

.tech-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--tech-dot-color);
  margin: 0 10px;
  box-shadow: 0 0 10px 2px var(--accent-glow);
  animation: dotPulse 3s infinite alternate;
}

@keyframes dotPulse {
  0% {
    transform: scale(1);
    opacity: 0.8;
  }
  100% {
    transform: scale(1.3);
    opacity: 1;
  }
}

/* 科技感卡片 */
.tech-card {
  background: rgba(18, 25, 47, 0.8);
  border: 1px solid rgba(0, 122, 255, 0.3);
  border-radius: 15px;
  padding: 25px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4),
    0 0 15px rgba(0, 122, 255, 0.2) inset;
  backdrop-filter: blur(10px);
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
}

.tech-card::before,
.tech-card::after {
  display: none !important;
}

/* 科技感页脚 */
.tech-footer {
  padding: 2.5rem 2rem;
  margin-top: 2.5rem;
  position: relative;
  text-align: center;
  z-index: 2;
  background: rgba(30, 30, 40, 0.5);
  border-top: 1px solid rgba(79, 109, 245, 0.1);
  backdrop-filter: blur(10px);
}

.footer-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  max-width: var(--content-width);
  margin: 0 auto;
}

.footer-divider {
  width: 70%;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    var(--tech-line-color),
    transparent
  );
  margin: 0.5rem 0;
}

.tech-footer-decoration {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 2rem auto 0.5rem;
  max-width: 350px;
}

.banner-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 1rem;
}

.banner-title {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--accent-color);
  margin-bottom: 1.5rem;
  text-align: center;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  letter-spacing: 1px;
}

/* Footer中的ScrollingBanner位置调整 */
.banner-section .scrolling-banner {
  position: relative;
  height: 200px;
  width: 100%;
  z-index: 1;
  opacity: 0.8;
  border-radius: 12px;
  overflow: hidden;
  background: rgba(18, 25, 47, 0.3);
}

/* 特别鸣谢部分 - 更新样式 */
.credits-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.credits-title {
  font-size: 1.2rem;
  font-weight: 500;
  color: var(--accent-color);
  margin-bottom: 1.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--tech-line-color);
  position: relative;
  letter-spacing: 1px;
}

.credits-title::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 30%;
  width: 40%;
  height: 2px;
  background-color: var(--accent-color);
  animation: creditsTitleGlow 3s infinite alternate;
}

.credits-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.5rem;
}

.credit-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: rgba(50, 50, 50, 0.7);
  border: 1px solid rgba(79, 109, 245, 0.2);
  border-radius: 8px;
  padding: 1rem;
  min-width: 120px;
  transform: translateY(0);
  transition: all var(--transition-normal);
  position: relative;
  overflow: hidden;
}

.credit-item:hover {
  transform: translateY(-5px);
  border-color: var(--accent-color);
  box-shadow: 0 5px 15px rgba(79, 109, 245, 0.2);
}

.credit-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    135deg,
    transparent 0%,
    rgba(79, 109, 245, 0.1) 50%,
    transparent 100%
  );
  transform: translateX(-100%);
  transition: transform 0.5s ease;
}

.credit-item:hover::before {
  transform: translateX(100%);
}

.credit-name {
  font-size: 1.1rem;
  color: var(--text-color);
  margin-bottom: 0.5rem;
  font-weight: 500;
  position: relative;
}

.credit-name::after {
  content: "";
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--accent-color);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.3s ease;
}

.credit-item:hover .credit-name::after {
  transform: scaleX(1);
  transform-origin: left;
}

.credit-role {
  font-size: 0.8rem;
  color: var(--accent-color);
}

/* 响应式调整 */
@media (min-width: 768px) {
  .footer-content {
    flex-direction: row;
    justify-content: space-between;
    max-width: var(--content-width);
    margin: 0 auto;
  }

  .footer-divider {
    width: 1px;
    height: 60px;
    margin: 0 1rem;
  }

  .credits-section {
    align-items: flex-end;
  }
}

/* 头部样式 */
header {
  padding: 1rem 2rem 0; /* 减小上方和下方的内边距 */
  text-align: center;
  background-color: transparent;
  position: relative;
  z-index: 2;
}

/* 标题容器样式 */
.title-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0; /* 移除内边距 */
  background: transparent; /* 移除渐变背景 */
  border-radius: 8px;
  position: relative;
  margin-bottom: 0.5rem; /* 减小下边距 */
}

.title-container::before {
  display: none;
}

.title-container::after {
  display: none;
}

/* 标题样式增强 */
.logo {
  font-size: 3.5rem;
  font-weight: 700;
  letter-spacing: 6px;
  margin-bottom: 0.5rem;
  color: var(--text-color);
  text-transform: uppercase;
  display: inline-block;
  position: relative;
  text-shadow: 0 0 15px rgba(79, 109, 245, 0.4);
  font-family: "Inter", sans-serif;
  background: linear-gradient(90deg, #f5f5f5 40%, #4f6df5 60%);
  background-size: 200% auto;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shineText 6s infinite linear;
}

@keyframes shineText {
  0% {
    background-position: 0% center;
  }
  100% {
    background-position: 200% center;
  }
}

/* 移除原来的下划线 */
.logo::after {
  display: none;
}

/* AI标记样式 */
.logo-badge {
  position: absolute;
  top: 0;
  right: -40px;
  background-color: var(--accent-color);
  color: white;
  font-size: 1.2rem;
  font-weight: 700;
  padding: 0.2rem 0.6rem;
  border-radius: 6px;
  box-shadow: 0 0 10px rgba(79, 109, 245, 0.7);
  animation: badgePulse 2s infinite alternate;
  transform: translateY(20%);
  letter-spacing: 1px;
  border: 1px solid rgba(255, 255, 255, 0.3);
}

@keyframes badgePulse {
  0% {
    box-shadow: 0 0 10px rgba(79, 109, 245, 0.5);
    background-color: var(--accent-color);
  }
  100% {
    box-shadow: 0 0 15px rgba(79, 109, 245, 0.8);
    background-color: #3a56d4;
  }
}

.tagline {
  font-size: 1.1rem;
  color: var(--text-secondary);
  font-weight: 300;
  margin-bottom: 0.5rem;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  letter-spacing: 0.5px;
  position: relative;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.tagline::after {
  content: "";
  position: absolute;
  bottom: -8px;
  left: 25%;
  width: 50%;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(79, 109, 245, 0.3),
    transparent
  );
}

.tagline-en {
  font-size: 0.9rem;
  color: rgba(176, 176, 176, 0.8);
  font-weight: 400;
  margin-bottom: 1.5rem;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* 主要内容区样式 */
.container {
  flex: 1;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto auto;
  gap: 2rem;
  padding: 0 2rem 3rem;
  max-width: var(--content-width);
  margin: 0 auto;
  width: 100%;
  position: relative;
  z-index: 2;
}

@media (min-width: 1200px) {
  .container {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto 1fr;
  }
}

/* 卡片基础样式 */
.card {
  background-color: var(--secondary-color);
  border-radius: var(--card-radius);
  padding: 1.5rem;
  box-shadow: 0 10px 30px var(--shadow-color);
  transition: transform var(--transition-normal),
    box-shadow var(--transition-normal);
  position: relative;
  overflow: hidden;
  z-index: 2;
}

.card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: var(--accent-color);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--transition-normal);
}

.card:hover::before {
  transform: scaleX(1);
}

.card:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 35px var(--shadow-strong);
}

/* 输入区域样式 */
.input-area {
  grid-column: 1 / -1;
  border-radius: 50px !important;
  /* 移除内边距和背景，因为内部胶囊已经有了完整的视觉效果 */
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important; /* 允许花瓣菜单溢出 */
}

.input-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.25rem;
}

.input-title {
  font-size: 1.25rem;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.input-title i {
  color: var(--accent-color);
}

textarea {
  width: 100%;
  min-height: 150px;
  padding: 1.25rem;
  border: none;
  border-radius: 8px;
  background-color: var(--dark-gray);
  color: var(--text-color);
  font-size: 1rem;
  font-family: "Inter", sans-serif;
  resize: vertical;
  transition: all var(--transition-normal);
  line-height: 1.6;
}

textarea::placeholder {
  color: var(--text-secondary);
  opacity: 0.6;
}

textarea:focus {
  outline: none;
  box-shadow: 0 0 0 2px var(--accent-color);
}

.submit-btn {
  background-color: var(--accent-color);
  color: var(--text-color);
  border: none;
  border-radius: 8px;
  padding: 0.9rem 1.8rem;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--transition-normal);
  margin-top: 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  box-shadow: 0 4px 12px rgba(79, 109, 245, 0.3);
  margin-left: 10px;
}

.submit-btn i {
  font-size: 1.2rem;
}

.submit-btn:hover {
  background-color: var(--accent-hover);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(79, 109, 245, 0.4);
}

.submit-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

/* 响应区域样式 */
.response-area {
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.response-content {
  font-size: 1rem;
  line-height: 1.7;
  white-space: pre-wrap;
  min-height: 200px;
  overflow-y: auto;
  max-height: 500px;
  padding-right: 0.5rem;
  font-family: "Roboto Mono", monospace;
  border-radius: 6px;
  padding: 1rem;
  background-color: var(--dark-gray);
}

.response-content::-webkit-scrollbar {
  width: 6px;
}

.response-content::-webkit-scrollbar-track {
  background: var(--dark-gray);
  border-radius: 6px;
}

.response-content::-webkit-scrollbar-thumb {
  background: var(--accent-color);
  border-radius: 6px;
}

.loading-indicator {
  color: var(--text-secondary);
  font-style: italic;
  position: relative;
}

.loading-indicator::after {
  content: "...";
  animation: loading 1.5s infinite;
  position: absolute;
}

@keyframes loading {
  0% {
    content: ".";
  }
  33% {
    content: "..";
  }
  66% {
    content: "...";
  }
}

.placeholder {
  color: var(--text-secondary);
  font-style: italic;
  opacity: 0.7;
}

/* 错误消息样式 */
.error-message {
  color: var(--error-color);
  border-left: 3px solid var(--error-color);
  padding: 0.75rem 1rem;
  display: block;
  margin: 1rem 0;
  background-color: rgba(255, 82, 82, 0.1);
  border-radius: 0 6px 6px 0;
}

.error-display {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--error-color);
  text-align: center;
  padding: 2rem;
}

.error-display p {
  font-size: 1.2rem;
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.error-display small {
  color: var(--text-secondary);
  max-width: 90%;
  word-break: break-word;
  line-height: 1.5;
}

/* 动画预览区域样式 */
.animation-preview {
  display: flex;
  flex-direction: column;
}

.preview-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.25rem;
}

.preview-title {
  font-size: 1.25rem;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.preview-title i {
  color: var(--accent-color);
}

.preview-tabs {
  display: flex;
  gap: 0.5rem;
}

.tab-btn {
  background-color: var(--dark-gray);
  color: var(--text-secondary);
  border: none;
  border-radius: 6px;
  padding: 0.6rem 1.2rem;
  font-size: 0.9rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--transition-normal);
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.tab-btn i {
  font-size: 1.1rem;
}

.tab-btn.active {
  background-color: var(--accent-color);
  color: var(--text-color);
}

.tab-btn:hover:not(.active) {
  background-color: rgba(79, 109, 245, 0.2);
  color: var(--light-gray);
}

.animation-container {
  flex: 1;
  background-color: var(--dark-gray);
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 350px;
  overflow: hidden;
  position: relative;
}

/* 加载动画 */
.loading-animation {
  position: relative;
  width: 60px;
  height: 60px;
}

.spinner {
  border: 3px solid transparent;
  border-top: 3px solid var(--accent-color);
  border-radius: 50%;
  width: 100%;
  height: 100%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.empty-preview {
  text-align: center;
  color: var(--text-secondary);
  padding: 2rem;
  max-width: 80%;
}

.code-preview {
  width: 100%;
  height: 100%;
  overflow: auto;
  padding: 1.5rem;
  font-family: "Roboto Mono", monospace;
  font-size: 0.9rem;
  line-height: 1.6;
  color: var(--text-color);
  background-color: var(--dark-gray);
  white-space: pre;
}

.animation-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  color: var(--text-secondary);
  text-align: center;
  font-style: italic;
}

.math-demo {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin-bottom: 1rem;
}

.math-symbol-large {
  font-size: 3rem;
  opacity: 0.8;
  color: var(--accent-color);
}

.math-symbol-medium {
  font-size: 2rem;
  opacity: 0.6;
}

.math-symbol-small {
  font-size: 1.5rem;
  opacity: 0.4;
}

.preview-note {
  font-size: 0.9rem;
  opacity: 0.7;
  animation: pulse 2s infinite;
  max-width: 60%;
}

@keyframes pulse {
  0% {
    opacity: 0.5;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.5;
  }
}

/* 底部样式 */
footer {
  background-color: var(--dark-gray);
  padding: 1.5rem;
  text-align: center;
  margin-top: auto;
  position: relative;
  z-index: 2;
}

.author-info {
  color: var(--text-secondary);
  font-size: 0.9rem;
}

.author-quote {
  font-style: italic;
  margin-top: 0.5rem;
  opacity: 0.8;
}

/* 响应式调整 */
@media (max-width: 768px) {
  .container {
    grid-template-columns: 1fr;
    padding: 0 1.5rem 2rem;
    gap: 1.5rem;
  }

  .card {
    padding: 1.25rem;
  }

  .logo {
    font-size: 2.25rem;
  }

  .tagline {
    font-size: 1rem;
  }

  .animation-container {
    min-height: 300px;
  }
}

/* 新增美化元素 */
.copy-btn {
  background-color: var(--dark-gray);
  color: var(--text-secondary);
  border: none;
  border-radius: 4px;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all var(--transition-fast);
  margin-left: auto;
}

.copy-btn:hover {
  background-color: var(--accent-color);
  color: var(--text-color);
}

.success-message {
  color: var(--success-color);
  border-left: 3px solid var(--success-color);
  padding: 0.75rem 1rem;
  display: block;
  margin: 1rem 0;
  background-color: rgba(76, 175, 80, 0.1);
  border-radius: 0 6px 6px 0;
}

/* 加载进度条 */
.progress-bar {
  width: 100%;
  height: 4px;
  background-color: var(--dark-gray);
  border-radius: 4px;
  margin-top: 1rem;
  overflow: hidden;
  position: relative;
}

.progress-fill {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background-color: var(--accent-color);
  border-radius: 4px;
  animation: loading-progress 2s infinite;
  width: 30%;
}

@keyframes loading-progress {
  0% {
    left: -30%;
  }
  100% {
    left: 100%;
  }
}

/* 页面加载动画 */
.page-loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--dark-gray);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  opacity: 1;
  transition: opacity 0.5s ease, visibility 0.5s ease;
}

.page-loader.hidden {
  opacity: 0;
  visibility: hidden;
}

.page-loader-content {
  text-align: center;
}

.page-loader-logo {
  font-size: 2.5rem;
  color: var(--text-color);
  margin-bottom: 1.5rem;
  letter-spacing: 3px;
  text-transform: uppercase;
}

.page-loader-spinner {
  width: 50px;
  height: 50px;
  border: 3px solid rgba(79, 109, 245, 0.3);
  border-top: 3px solid var(--accent-color);
  border-radius: 50%;
  margin: 0 auto;
  animation: spin 1s linear infinite;
}

/* 渲染错误样式 */
.render-error {
  background-color: rgba(255, 82, 82, 0.05);
  border-radius: 8px;
  padding: 20px;
  margin: 10px 0;
  max-width: 100%;
  overflow: auto;
}

.render-error h3 {
  color: #ff5252;
  margin-top: 0;
  margin-bottom: 15px;
}

.render-error pre {
  background-color: rgba(0, 0, 0, 0.05);
  padding: 15px;
  border-radius: 6px;
  overflow: auto;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--text-secondary);
  margin-bottom: 15px;
  white-space: pre-wrap;
}

/* AI修复按钮样式 */
.fix-btn {
  background-color: var(--accent-color);
  color: white;
  border: none;
  border-radius: 6px;
  padding: 8px 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  transition: all 0.2s ease;
  margin-top: 15px;
}

.fix-btn:hover {
  background-color: #3a56d4;
}

.fix-btn:disabled {
  background-color: #cccccc;
  cursor: not-allowed;
  opacity: 0.7;
}

.fix-btn i {
  font-size: 16px;
}

/* 修复中状态样式 */
.fixing-state {
  margin-top: 15px;
  background-color: rgba(0, 0, 0, 0.05);
  border-radius: 8px;
  padding: 15px;
}

.fixing-state .spinner {
  width: 20px;
  height: 20px;
  border: 3px solid rgba(79, 109, 245, 0.3);
  border-top-color: var(--accent-color);
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-right: 10px;
  display: inline-block;
}

.fixing-state p {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  color: var(--text-secondary);
}

.fixed-code-preview {
  max-height: 200px;
  overflow: auto;
  background-color: rgba(255, 255, 255, 0.1);
  padding: 10px;
  border-radius: 6px;
  font-size: 12px;
  margin: 0;
  white-space: pre-wrap;
  color: var(--text-secondary);
}

/* 重新渲染按钮样式 */
.rerender-btn {
  background-color: #4caf50;
  color: white;
  border: none;
  border-radius: 6px;
  padding: 8px 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 14px;
  transition: all 0.2s ease;
  margin-top: 15px;
}

.rerender-btn:hover {
  background-color: #3e8e41;
}

.rerender-btn i {
  font-size: 16px;
}

/* 检查状态按钮样式 */
.check-status-btn {
  background-color: #2196f3;
  color: white;
  border: none;
  border-radius: 6px;
  padding: 8px 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 14px;
  transition: all 0.2s ease;
  margin-top: 15px;
}

.check-status-btn:hover {
  background-color: #0b7dda;
}

.check-status-btn:disabled {
  background-color: #cccccc;
  cursor: wait;
  opacity: 0.7;
}

.check-status-btn i {
  font-size: 16px;
}

/* 视频播放器样式 */
.video-player {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.video-player video {
  width: 100%;
  max-width: 800px;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.render-time {
  margin-top: 10px;
  color: var(--text-secondary);
  font-size: 0.9rem;
}

/* 渲染中状态样式 */
.rendering-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px;
}

.rendering-state .spinner {
  width: 40px;
  height: 40px;
  border: 4px solid rgba(79, 109, 245, 0.3);
  border-top-color: var(--accent-color);
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 20px;
}

.rendering-state p {
  color: var(--text-secondary);
  margin: 5px 0;
}

.render-tip {
  font-size: 0.8rem;
  color: var(--text-tertiary);
}

.loading-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 50px 20px;
}

.loading-state .spinner {
  width: 40px;
  height: 40px;
  border: 4px solid rgba(79, 109, 245, 0.3);
  border-top-color: var(--accent-color);
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 20px;
}

.error-state {
  background-color: rgba(255, 82, 82, 0.05);
  border-radius: 8px;
  padding: 20px;
  margin: 10px 0;
  text-align: center;
}

.error-state i {
  color: #ff5252;
  font-size: 2rem;
  margin-bottom: 15px;
}

/* 代码容器样式 */
.code-container {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  background-color: rgba(0, 0, 0, 0.03);
}

.code-header {
  display: flex;
  justify-content: flex-end;
  padding: 8px;
  background-color: rgba(0, 0, 0, 0.05);
}

.code-block {
  padding: 15px;
  margin: 0;
  overflow: auto;
  font-family: monospace;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--text-primary);
  background-color: transparent;
  max-height: 400px;
}

/* 预览内容容器 */
.preview-content {
  width: 100%;
  min-height: 400px;
  border-radius: 8px;
  overflow: hidden;
  background-color: rgba(0, 0, 0, 0.03);
  padding: 15px;
}

/* 动画容器样式 */
.animation-container {
  width: 100%;
  min-height: 400px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* 渲染错误修复界面样式 */
.render-error-fix {
  margin-top: 1.5rem;
  padding: 1.25rem;
  background-color: var(--dark-gray);
  border-radius: 8px;
  border-left: 4px solid var(--error-color);
  position: relative;
}

.render-error-fix h3 {
  font-size: 1.1rem;
  font-weight: 500;
  margin-bottom: 0.75rem;
  color: var(--error-color);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.render-error-fix h3 i {
  font-size: 1.2rem;
}

.render-error-fix .error-message {
  font-size: 0.9rem;
  color: var(--text-secondary);
  margin-bottom: 1rem;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 120px;
  overflow-y: auto;
  background-color: rgba(0, 0, 0, 0.2);
  padding: 0.75rem;
  border-radius: 4px;
}

.fixed-code-container {
  margin-top: 1.25rem;
  animation: fadeIn 0.3s ease-in-out;
}

.fixed-code-container h4 {
  font-size: 0.95rem;
  font-weight: 500;
  margin-bottom: 0.5rem;
  color: var(--success-color);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.fixed-code {
  font-family: "Fira Code", monospace;
  font-size: 0.85rem;
  line-height: 1.5;
  background-color: rgba(0, 0, 0, 0.3);
  padding: 1rem;
  border-radius: 6px;
  overflow-x: auto;
  white-space: pre;
  color: var(--text-color);
  max-height: 300px;
  overflow-y: auto;
  margin-bottom: 1rem;
  border-left: 3px solid var(--success-color);
}

.fixed-code-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 0.75rem;
}

.copy-fixed-btn {
  background-color: transparent;
  color: var(--text-color);
  border: 1px solid var(--text-secondary);
  border-radius: 6px;
  padding: 0.6rem 1.2rem;
  font-size: 0.9rem;
  font-weight: 400;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  transition: all var(--transition-normal);
}

.copy-fixed-btn:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: var(--text-color);
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 确保复用现有样式 */
.render-error-fix .fix-btn,
.render-error-fix .rerender-btn {
  margin-top: 0.75rem;
}

/* 使用现有的修复中状态样式 */
.render-error-fix .fixing-state {
  margin-top: 1rem;
  background-color: rgba(0, 0, 0, 0.3);
  padding: 1rem;
  border-radius: 6px;
  position: relative;
}

.render-error-fix .fixed-code-preview {
  font-family: "Fira Code", monospace;
  font-size: 0.85rem;
  line-height: 1.5;
  margin-top: 0.75rem;
  padding: 0.75rem;
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  overflow-x: auto;
  white-space: pre;
  color: var(--text-color);
  opacity: 0.8;
  max-height: 200px;
  overflow-y: auto;
}

/* 服务器状态样式 */
.server-status {
  margin-top: 15px;
  padding: 10px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
}

.server-status.success {
  background-color: rgba(76, 175, 80, 0.1);
  border-left: 3px solid var(--success-color);
  color: var(--success-color);
}

.server-status.error {
  background-color: rgba(255, 82, 82, 0.1);
  border-left: 3px solid var(--error-color);
  color: var(--error-color);
}

/* 创始人信息美化 */
.founder-card {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  padding: 1rem 1.2rem;
  background: rgba(50, 50, 50, 0.7);
  border-radius: 12px;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(79, 109, 245, 0.15);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.founder-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    135deg,
    transparent 0%,
    rgba(79, 109, 245, 0.05) 50%,
    transparent 100%
  );
  z-index: 0;
}

.founder-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
  border-color: rgba(79, 109, 245, 0.3);
}

.founder-avatar {
  position: relative;
  width: 55px;
  height: 55px;
  border-radius: 50%;
  overflow: visible;
  flex-shrink: 0;
}

.founder-avatar-inner {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, var(--accent-color), #2a4ce2);
  color: white;
  font-size: 1.5rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  position: relative;
  z-index: 1;
  box-shadow: 0 2px 10px rgba(79, 109, 245, 0.4);
}

.founder-avatar-glow {
  position: absolute;
  top: -2px;
  left: -2px;
  right: -2px;
  bottom: -2px;
  border-radius: 50%;
  background: transparent;
  z-index: 0;
  box-shadow: 0 0 15px 5px rgba(79, 109, 245, 0.4);
  animation: founderGlow 3s infinite alternate;
}

@keyframes founderGlow {
  0% {
    opacity: 0.5;
    box-shadow: 0 0 10px 2px rgba(79, 109, 245, 0.3);
  }
  100% {
    opacity: 0.8;
    box-shadow: 0 0 20px 5px rgba(79, 109, 245, 0.5);
  }
}

.founder-details {
  display: flex;
  flex-direction: column;
  z-index: 1;
}

.founder-name {
  font-size: 1.2rem;
  font-weight: 500;
  color: var(--text-color);
  margin-bottom: 0.3rem;
  position: relative;
  display: inline-block;
}

.founder-name::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, var(--accent-color), transparent);
}

.founder-quote {
  font-size: 0.95rem;
  color: var(--text-secondary);
  font-style: italic;
  line-height: 1.4;
  position: relative;
}

.founder-quote::before {
  content: open-quote;
  color: var(--accent-color);
  font-size: 1.2em;
  margin-right: 2px;
}

.founder-quote::after {
  content: close-quote;
  color: var(--accent-color);
  font-size: 1.2em;
  margin-left: 2px;
}

/* 响应式调整 */
@media (max-width: 480px) {
  .founder-card {
    flex-direction: column;
    text-align: center;
    padding: 1.5rem 1rem;
  }

  .founder-name::after {
    left: 25%;
    width: 50%;
  }
}

@keyframes creditsTitleGlow {
  0% {
    box-shadow: 0 0 5px 1px rgba(79, 109, 245, 0.3);
  }
  100% {
    box-shadow: 0 0 10px 2px rgba(79, 109, 245, 0.5);
  }
}

/* 通行关卡样式 */
.access-gate {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: var(--background-gradient);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  overflow: hidden;
}

.access-gate::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    circle at center,
    rgba(79, 109, 245, 0.1) 0%,
    rgba(0, 0, 0, 0) 70%
  );
  z-index: -1;
  animation: gatePulse 8s infinite alternate;
}

@keyframes gatePulse {
  0% {
    opacity: 0.3;
    transform: scale(0.9);
  }
  100% {
    opacity: 0.7;
    transform: scale(1.1);
  }
}

.access-gate-container {
  width: 100%;
  height: 100%;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
  animation: fadeIn 0.8s ease-out;
}

.access-gate-container .gate-container {
  box-sizing: border-box;
  padding: 20px;
  max-width: 460px;
  width: 100%;
}

.gate-logo-container {
  text-align: center;
  margin-bottom: 1rem;
}

.gate-logo {
  position: relative;
  display: inline-block;
  margin-bottom: 1rem;
  padding: 0.5rem 1rem;
}

.gate-tagline {
  color: var(--text-secondary);
  font-size: 1.1rem;
  font-weight: 300;
  letter-spacing: 0.5px;
  margin-top: 0.5rem;
  position: relative;
  padding-bottom: 1rem;
}

.gate-tagline::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 30%;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    var(--accent-color),
    transparent
  );
}

.gate-card {
  width: 100%;
  background: rgba(25, 25, 30, 0.7);
  border-radius: var(--card-radius);
  backdrop-filter: blur(10px);
  /* overflow: hidden; */
  position: relative;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.3),
    0 0 1px rgba(255, 255, 255, 0.1) inset;
  transform: translateY(0);
  transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;
}

.gate-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(
    90deg,
    transparent,
    var(--accent-color),
    transparent
  );
  opacity: 0.7;
}

.gate-card::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    var(--accent-color),
    transparent
  );
  opacity: 0.3;
}

.gate-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4), 0 0 15px var(--accent-glow);
}

.gate-card-inner {
  padding: 2.5rem 2rem;
}

.gate-header {
  text-align: center;
  margin-bottom: 2rem;
}

.gate-header h2 {
  font-size: 1.8rem;
  margin-bottom: 0.5rem;
  background: linear-gradient(
    90deg,
    var(--text-color),
    var(--accent-color) 70%
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 600;
  letter-spacing: 1px;
}

.gate-header p {
  color: var(--text-secondary);
  font-size: 0.95rem;
}

.gate-form {
  margin-bottom: 2rem;
}

.key-input-container {
  margin-bottom: 1.5rem;
  position: relative;
}

.key-input {
  width: 100%;
  background: rgba(30, 30, 35, 0.6);
  border: 1px solid rgba(79, 109, 245, 0.3);
  border-radius: 8px;
  padding: 1rem 1.2rem;
  color: var(--text-color);
  font-size: 1rem;
  transition: all 0.2s ease;
  letter-spacing: 2px;
}

.key-input:focus {
  outline: none;
  border-color: var(--accent-color);
  box-shadow: 0 0 0 2px var(--accent-glow);
}

.key-input::placeholder {
  color: rgba(176, 176, 176, 0.5);
}

.key-error {
  color: var(--error-color);
  font-size: 0.85rem;
  margin-top: 0.5rem;
  animation: errorShake 0.4s ease-in-out;
}

@keyframes errorShake {
  0%,
  100% {
    transform: translateX(0);
  }
  20%,
  60% {
    transform: translateX(-5px);
  }
  40%,
  80% {
    transform: translateX(5px);
  }
}

.key-submit {
  width: 100%;
  background: var(--accent-color);
  color: white;
  border: none;
  border-radius: 8px;
  padding: 1rem;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  letter-spacing: 1px;
  position: relative;
  overflow: hidden;
}

.key-submit::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.2),
    transparent
  );
  transition: all 0.5s ease;
}

.key-submit:hover {
  background: var(--accent-hover);
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(79, 109, 245, 0.4);
}

.key-submit:hover::before {
  left: 100%;
}

.key-submit:active {
  transform: translateY(1px);
}

.arrow-icon {
  font-style: normal;
  font-size: 1.2rem;
  transition: transform 0.3s ease;
}

.key-submit:hover .arrow-icon {
  transform: translateX(5px);
}

.gate-footer {
  text-align: center;
  color: var(--text-secondary);
  font-size: 0.85rem;
}

.contact-link {
  color: var(--accent-color);
  text-decoration: none;
  margin-left: 0.3rem;
  position: relative;
  display: inline-block;
  margin-top: 0.5rem;
  transition: all 0.2s ease;
}

.contact-link::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--accent-color);
  transition: width 0.3s ease;
}

.contact-link:hover {
  color: white;
}

.contact-link:hover::after {
  width: 100%;
}

/* 响应式设计 */
@media (max-width: 480px) {
  .gate-card-inner {
    padding: 2rem 1.5rem;
  }

  .gate-header h2 {
    font-size: 1.5rem;
  }

  .key-input {
    padding: 0.8rem 1rem;
  }

  .key-submit {
    padding: 0.8rem;
  }
}

/* 数学符号背景动画 - 给通行关卡添加背景效果 */
.access-gate .math-symbol {
  opacity: 0.2;
  color: var(--accent-color);
  animation-duration: 30s;
}

/* 退出按钮样式 */
.logout-btn,
.change-password-btn {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  background: rgba(25, 25, 30, 0.6);
  border: 1px solid rgba(79, 109, 245, 0.3);
  color: var(--text-secondary);
  border-radius: 6px;
  padding: 0.5rem 1rem;
  font-size: 0.85rem;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  white-space: nowrap;
  backdrop-filter: blur(10px);
}

.change-password-btn {
  position: relative;
  background: rgba(25, 25, 30, 0.7);
}

.logout-btn::before,
.change-password-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    45deg,
    transparent,
    rgba(79, 109, 245, 0.1),
    transparent
  );
  opacity: 0;
  transition: opacity 0.3s ease;
}

.logout-btn:hover,
.change-password-btn:hover {
  color: var(--text-color);
  border-color: var(--accent-color);
  box-shadow: 0 0 15px rgba(79, 109, 245, 0.2);
}

.logout-btn:hover::before,
.change-password-btn:hover::before {
  opacity: 1;
}

@media (max-width: 480px) {
  .logout-btn,
  .change-password-btn {
    top: 1rem;
    right: 1rem;
    padding: 0.4rem 0.8rem;
    font-size: 0.8rem;
  }
}

/* 用户控制样式 */
.user-controls {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.5rem;
}

.user-credits {
  background: rgba(25, 25, 30, 0.7);
  border: 1px solid rgba(79, 109, 245, 0.3);
  border-radius: 6px;
  padding: 0.4rem 0.8rem;
  font-size: 0.85rem;
  color: var(--text-secondary);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.user-credits span {
  color: var(--text-color);
  font-weight: 500;
}

.user-credits span.low-credits {
  color: var(--error-color);
}

.recharge-btn {
  background: var(--accent-color);
  color: white;
  border: none;
  border-radius: 4px;
  padding: 0.2rem 0.5rem;
  font-size: 0.75rem;
  cursor: pointer;
  transition: all 0.2s ease;
}

.recharge-btn:hover {
  background: var(--accent-hover);
  transform: translateY(-1px);
}

/* 超级VIP徽章样式 */
.super-vip-badge-container {
  display: flex;
  align-items: center;
  justify-content: center;
}

.super-vip-badge {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, #FFD700 0%, #FFA500 50%, #FF8C00 100%);
  border: 2px solid #FFD700;
  border-radius: 20px;
  padding: 8px 20px;
  color: #1a1a1a;
  font-weight: 700;
  font-size: 0.9rem;
  box-shadow: 
    0 4px 15px rgba(255, 215, 0, 0.4),
    0 0 20px rgba(255, 215, 0, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
  animation: vip-glow 2s ease-in-out infinite alternate;
  overflow: hidden;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.super-vip-badge i {
  font-size: 1.2rem;
  animation: crown-bounce 1.5s ease-in-out infinite;
}

.super-vip-text {
  letter-spacing: 0.5px;
  white-space: nowrap;
}

.super-vip-shine {
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    45deg,
    transparent 0%,
    transparent 40%,
    rgba(255, 255, 255, 0.3) 50%,
    transparent 60%,
    transparent 100%
  );
  animation: shine-sweep 3s ease-in-out infinite;
}

@keyframes vip-glow {
  0% {
    box-shadow: 
      0 4px 15px rgba(255, 215, 0, 0.4),
      0 0 20px rgba(255, 215, 0, 0.3),
      inset 0 1px 0 rgba(255, 255, 255, 0.5);
  }
  100% {
    box-shadow: 
      0 4px 20px rgba(255, 215, 0, 0.6),
      0 0 30px rgba(255, 215, 0, 0.5),
      inset 0 1px 0 rgba(255, 255, 255, 0.7);
  }
}

@keyframes crown-bounce {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-3px) rotate(-5deg);
  }
}

@keyframes shine-sweep {
  0% {
    transform: translateX(-100%) translateY(-100%);
  }
  100% {
    transform: translateX(100%) translateY(100%);
  }
}

/* 模式消耗处的超级VIP徽章 */
.mode-super-vip-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: linear-gradient(135deg, #FFD700, #FFA500);
  color: #1a1a1a;
  padding: 4px 12px;
  border-radius: 12px;
  font-weight: 700;
  font-size: 0.85rem;
  box-shadow: 0 2px 8px rgba(255, 215, 0, 0.4);
  animation: vip-pulse 2s ease-in-out infinite;
}

.mode-super-vip-badge i {
  font-size: 1rem;
}

/* 模式网格中的超级VIP显示 */
.mode-grid-super-vip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #FFD700;
  font-weight: 700;
  font-size: 0.85rem;
  animation: vip-shimmer 2s ease-in-out infinite;
}

.mode-grid-super-vip i {
  font-size: 1rem;
}

@keyframes vip-pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 2px 8px rgba(255, 215, 0, 0.4);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(255, 215, 0, 0.6);
  }
}

@keyframes vip-shimmer {
  0%, 100% {
    text-shadow: 0 0 5px rgba(255, 215, 0, 0.5);
  }
  50% {
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.8);
  }
}

.user-info {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.welcome-text {
  color: var(--text-secondary);
  font-size: 0.85rem;
}

/* 表单样式 */
.form-group {
  margin-bottom: 1.2rem;
}

.form-group label {
  display: block;
  margin-bottom: 0.4rem;
  color: var(--text-color);
  font-size: 0.9rem;
}

.form-input {
  width: 100%;
  background: rgba(30, 30, 35, 0.6);
  border: 1px solid rgba(79, 109, 245, 0.3);
  border-radius: 6px;
  padding: 0.8rem 1rem;
  color: var(--text-color);
  font-size: 0.95rem;
  transition: all 0.2s ease;
}

.form-input:focus {
  outline: none;
  border-color: var(--accent-color);
  box-shadow: 0 0 0 2px var(--accent-glow);
}

.form-input::placeholder {
  color: rgba(176, 176, 176, 0.5);
}

.auth-error {
  background: rgba(255, 82, 82, 0.1);
  border: 1px solid rgba(255, 82, 82, 0.3);
  color: #ff5252;
  padding: 0.8rem 1rem;
  border-radius: 6px;
  margin-bottom: 1.2rem;
  font-size: 0.9rem;
  animation: errorShake 0.4s ease-in-out;
}

.auth-success {
  background: rgba(76, 175, 80, 0.1);
  border: 1px solid rgba(76, 175, 80, 0.3);
  color: #4caf50;
  padding: 0.8rem 1rem;
  border-radius: 6px;
  margin-bottom: 1.2rem;
  font-size: 0.9rem;
}

.toggle-auth-btn {
  background: none;
  border: none;
  color: var(--accent-color);
  cursor: pointer;
  font-size: 0.85rem;
  padding: 0;
  margin-left: 0.3rem;
  transition: color 0.2s ease;
}

.toggle-auth-btn:hover {
  color: white;
  text-decoration: underline;
}

/* 模态窗口样式 */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(5px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 100;
  animation: fadeIn 0.3s ease;
}

.modal-container {
  background: rgba(25, 25, 30, 0.9);
  border-radius: var(--card-radius);
  width: 90%;
  max-width: 500px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4), 0 0 15px var(--accent-glow);
  overflow: hidden;
  position: relative;
  animation: modalSlideUp 0.4s ease;
}

.modal-container::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(
    90deg,
    transparent,
    var(--accent-color),
    transparent
  );
  opacity: 0.7;
}

.modal-header {
  padding: 1.2rem 1.5rem;
  border-bottom: 1px solid rgba(79, 109, 245, 0.2);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal-header h2 {
  font-size: 1.4rem;
  margin: 0;
  background: linear-gradient(
    90deg,
    var(--text-color),
    var(--accent-color) 70%
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 600;
}

.modal-close {
  background: none;
  border: none;
  color: var(--text-secondary);
  font-size: 1.8rem;
  cursor: pointer;
  transition: color 0.2s ease;
  padding: 0;
  line-height: 1;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-close:hover {
  color: var(--text-color);
}

.modal-body {
  padding: 1.5rem;
}

.pricing-info {
  margin-bottom: 1.5rem;
  padding: 1rem;
  background: rgba(30, 30, 35, 0.6);
  border-radius: 6px;
}

.pricing-info p {
  margin: 0.5rem 0;
  color: var(--text-secondary);
}

.pricing-info strong {
  color: var(--text-color);
}

/* 支付金额选项 */
.payment-amount-options {
  display: flex;
  gap: 0.8rem;
  margin-top: 0.5rem;
}

.amount-option {
  flex: 1;
  background: rgba(30, 30, 35, 0.6);
  border: 1px solid rgba(79, 109, 245, 0.3);
  border-radius: 6px;
  padding: 0.8rem;
  color: var(--text-secondary);
  font-size: 0.9rem;
  cursor: pointer;
  transition: all 0.2s ease;
  text-align: center;
}

.amount-option:hover {
  border-color: var(--accent-color);
  color: var(--text-color);
}

.amount-option.active {
  background: rgba(79, 109, 245, 0.2);
  border-color: var(--accent-color);
  color: var(--text-color);
  box-shadow: 0 0 10px rgba(79, 109, 245, 0.3);
}

/* 支付方式选项 */
.payment-method-options {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 0.5rem;
}

.payment-method {
  flex: 1;
  min-width: 120px;
  background: rgba(30, 30, 35, 0.6);
  border: 1px solid rgba(79, 109, 245, 0.3);
  border-radius: 6px;
  padding: 0.8rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  transition: all 0.2s ease;
}

.payment-method:hover {
  border-color: var(--accent-color);
}

.payment-method.active {
  background: rgba(79, 109, 245, 0.2);
  border-color: var(--accent-color);
  box-shadow: 0 0 10px rgba(79, 109, 245, 0.3);
}

.payment-method input {
  margin: 0;
}

.payment-method label {
  margin: 0;
  cursor: pointer;
  color: var(--text-secondary);
}

.payment-method.active label {
  color: var(--text-color);
}

.payment-submit {
  width: 100%;
  background: var(--accent-color);
  color: white;
  border: none;
  border-radius: 8px;
  padding: 1rem;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease;
  margin-top: 1.5rem;
  position: relative;
  overflow: hidden;
}

.payment-submit::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.2),
    transparent
  );
  transition: all 0.5s ease;
}

.payment-submit:hover {
  background: var(--accent-hover);
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(79, 109, 245, 0.4);
}

.payment-submit:hover::before {
  left: 100%;
}

.payment-submit:active {
  transform: translateY(1px);
}

@keyframes modalSlideUp {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 响应式样式调整 */
@media (max-width: 768px) {
  .user-controls {
    position: relative;
    top: 0;
    right: 0;
    margin-top: 1rem;
    width: 100%;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .user-info {
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
  }

  .logout-btn {
    position: static;
    margin-top: 0;
  }

  .payment-amount-options {
    flex-direction: column;
  }

  .payment-method-options {
    flex-direction: column;
  }

  .payment-method {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .modal-container {
    width: 95%;
  }

  .modal-header {
    padding: 1rem;
  }

  .modal-body {
    padding: 1rem;
  }

  .amount-option,
  .payment-method {
    padding: 0.6rem;
    font-size: 0.8rem;
  }

  .payment-submit {
    padding: 0.8rem;
  }

  .gate-card-inner {
    padding: 1.5rem;
  }

  .form-input {
    padding: 0.7rem 0.8rem;
  }
}

/* 邮箱验证码UI相关样式 */
.input-with-button {
  display: flex;
  gap: 0.5rem;
  width: 100%;
}

.input-with-button .form-input {
  flex: 1;
}

.send-code-btn {
  background: var(--accent-color);
  color: white;
  border: none;
  border-radius: 6px;
  padding: 0.5rem 1rem;
  font-size: 0.85rem;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  min-width: 100px;
}

.send-code-btn:hover:not(:disabled) {
  background: var(--accent-hover);
  transform: translateY(-1px);
}

.send-code-btn:disabled {
  background: #555;
  opacity: 0.7;
  cursor: not-allowed;
}

.code-hint {
  margin-top: 0.5rem;
  font-size: 0.8rem;
  color: var(--accent-color);
  padding: 0.25rem 0.5rem;
  background-color: rgba(79, 109, 245, 0.1);
  border-radius: 4px;
}

/* 验证码输入框特定样式 */
#code {
  letter-spacing: 0.2em;
  font-weight: 500;
}

/* 图片上传相关样式 */
.image-preview-container {
  position: relative;
  margin: 10px 0;
  max-width: 400px;
  border-radius: 8px;
  overflow: hidden;
  border: 2px solid var(--border-color);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
}

.image-preview {
  width: 100%;
  height: auto;
  display: block;
}

.remove-image-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  border: none;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.remove-image-btn:hover {
  background-color: rgba(255, 0, 0, 0.7);
}

.upload-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  background-color: var(--secondary-color);
  color: var(--text-color);
  border: 1px solid var(--border-color);
  border-radius: 4px;
  padding: 5px 10px;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.upload-btn:hover {
  background-color: var(--hover-color);
}

.upload-btn i {
  font-size: 16px;
}

/* 确保上传按钮在禁用状态下样式正确 */
.upload-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* 调整上传按钮和提交按钮间的间距 */
.submit-btn {
  margin-left: 10px;
}

/* 响应式调整 */
@media (max-width: 768px) {
  .image-preview-container {
    max-width: 100%;
  }
}

/* ===== Interactive Viewer Styles ===== */
/* 注意：.threejs-viewer 的主要样式现在定义在 InteractiveViewer.css 中 */
/* 这里保留一些旧的备用样式，但QQViewer和InteractiveViewer应该使用专门的CSS文件 */
.threejs-viewer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: var(--background-color);
  border: none;
  border-radius: 0;
  box-shadow: none;
  z-index: 1100;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  max-width: 100vw;
  max-height: 100vh;
}

.threejs-viewer.fullscreen {
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  border-radius: 0;
}

.viewer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 20px;
  background: linear-gradient(135deg, var(--accent-color), #5a67d8);
  color: white;
  border-bottom: 1px solid var(--border-color);
}

.viewer-header h3 {
  margin: 0;
  font-size: 1.2rem;
  display: flex;
  align-items: center;
  gap: 8px;
}

.viewer-controls {
  display: flex;
  gap: 8px;
}

.control-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 8px 12px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  color: white;
  font-size: 0.9rem;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
}

.control-btn:hover {
  background: rgba(255, 255, 255, 0.2);
  transform: translateY(-1px);
}

.control-btn.close-btn {
  background: rgba(239, 68, 68, 0.8);
  border-color: rgba(239, 68, 68, 0.4);
}

.control-btn.close-btn:hover {
  background: rgba(239, 68, 68, 1);
}

.viewer-content {
  flex: 1;
  display: flex;
  position: relative;
  background: #f8f9fa;
}

.html-iframe {
  width: 100%;
  height: 100%;
  border: none;
  background: white;
}

.no-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--text-secondary);
  font-size: 1.1rem;
}

.no-content i {
  font-size: 3rem;
  margin-bottom: 15px;
  opacity: 0.5;
}

.viewer-info {
  padding: 10px 20px;
  background: var(--background-secondary);
  border-top: 1px solid var(--border-color);
  font-size: 0.9rem;
  color: var(--text-secondary);
}

.viewer-info p {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.viewer-info i {
  color: var(--accent-color);
}

/* 模式切换器样式 */
.mode-selector {
  display: flex;
  background: var(--background-secondary);
  border-radius: 12px;
  padding: 4px;
  margin-bottom: 20px;
  border: 1px solid var(--border-color);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  /* 确保在所有容器布局下都有足够宽度 */
  width: 100%;
  min-width: 600px;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  /* 关键：在2列网格布局中跨越两列 */
  grid-column: span 2;
}

.mode-button {
  flex: 1;
  padding: 12px 20px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--text-secondary);
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 1rem;
}

.mode-button:hover {
  color: var(--text-color);
  background: rgba(79, 109, 245, 0.1);
}

.mode-button.active {
  background: var(--accent-color);
  color: white;
  box-shadow: 0 2px 8px rgba(79, 109, 245, 0.3);
}

.mode-button i {
  font-size: 1.1rem;
}

/* 模式信息样式 */
.mode-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.mode-name {
  font-size: 1rem;
  font-weight: 500;
}

.mode-credits {
  font-size: 0.75rem;
  padding: 2px 8px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.8);
  font-weight: 400;
  transition: all 0.3s ease;
}

.mode-credits.premium {
  background: linear-gradient(135deg, #ff6b6b, #ffa500);
  color: white;
  font-weight: 600;
  cursor: pointer;
  position: relative;
  animation: premium-glow 2s ease-in-out infinite alternate;
}

.mode-credits.premium:hover {
  transform: scale(1.05);
  box-shadow: 0 2px 8px rgba(255, 107, 107, 0.4);
}

@keyframes premium-glow {
  0% {
    box-shadow: 0 0 5px rgba(255, 107, 107, 0.5);
  }
  100% {
    box-shadow: 0 0 15px rgba(255, 165, 0, 0.6);
  }
}

/* 积分解释弹窗样式 */
.credit-explanation-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10000;
  backdrop-filter: blur(5px);
}

.credit-explanation-modal-content {
  background: var(--background-color);
  border-radius: 20px;
  padding: 30px;
  max-width: 600px;
  width: 90%;
  max-height: 80vh;
  overflow-y: auto;
  position: relative;
  border: 1px solid var(--border-color);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.credit-explanation-modal-content h2 {
  color: var(--accent-color);
  margin-bottom: 20px;
  text-align: center;
  font-size: 1.5rem;
}

.explanation-content {
  margin-bottom: 25px;
}

.explanation-section {
  margin-bottom: 25px;
}

.explanation-section h3 {
  color: var(--text-color);
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.1rem;
}

.explanation-section h3 i {
  color: var(--accent-color);
}

.explanation-section p {
  color: var(--text-secondary);
  line-height: 1.6;
  margin-bottom: 10px;
}

.explanation-section ul {
  list-style: none;
  padding: 0;
}

.explanation-section li {
  color: var(--text-secondary);
  line-height: 1.6;
  margin-bottom: 8px;
  padding-left: 0;
}

.mode-comparison {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.comparison-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--background-secondary);
  border-radius: 8px;
  border-left: 3px solid transparent;
}

.mode-tag {
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 0.8rem;
  font-weight: 600;
  min-width: 70px;
  text-align: center;
}

.mode-tag.manim {
  background: linear-gradient(135deg, #ff6b6b, #ffa500);
  color: white;
}

.mode-tag.manimgx {
  background: linear-gradient(135deg, #fa541c, #fa8c16);
  color: white;
}

.mode-tag.threejs {
  background: #10b981;
  color: white;
}

.mode-tag.geogebra {
  background: #3b82f6;
  color: white;
}

.process {
  flex: 1;
  font-size: 0.9rem;
  color: var(--text-secondary);
}

.cost {
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 0.8rem;
  font-weight: 600;
}

.cost.high {
  background: rgba(255, 107, 107, 0.2);
  color: #ff6b6b;
}

.cost.low {
  background: rgba(16, 185, 129, 0.2);
  color: #10b981;
}

.understand-btn {
  width: 100%;
  padding: 12px;
  background: linear-gradient(135deg, var(--accent-color), #6366f1);
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
}

.understand-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(79, 109, 245, 0.4);
}

/* 简化版积分解释弹窗样式 */
.credit-explanation-modal-content.simple {
  max-width: 400px;
  padding: 40px 30px;
  text-align: center;
}

.simple-explanation {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.expensive-meme {
  width: 200px;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
  transition: transform 0.3s ease;
}

.expensive-meme:hover {
  transform: scale(1.05) rotate(1deg);
}

.guess-text-cn {
  font-size: 2rem;
  font-weight: bold;
  color: var(--accent-color);
  margin: 0;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  animation: bounce 2s ease-in-out infinite;
}

.guess-text-en {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--text-secondary);
  margin: 0;
  letter-spacing: 2px;
  text-transform: uppercase;
  opacity: 0.8;
}

@keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-10px);
  }
  60% {
    transform: translateY(-5px);
  }
}

/* 交互模式特定样式 */
.threejs-mode .input-section {
  border-left: 3px solid #10b981;
}

.threejs-mode .generate-btn {
  background: linear-gradient(135deg, #10b981, #059669);
}

.threejs-mode .generate-btn:hover {
  background: linear-gradient(135deg, #059669, #047857);
}

/* 响应式设计 */
@media (max-width: 768px) {
  .threejs-viewer {
    top: 5%;
    left: 5%;
    width: 90%;
    height: 90%;
  }

  .viewer-header {
    padding: 12px 15px;
  }

  .viewer-header h3 {
    font-size: 1.1rem;
  }

  .viewer-controls {
    gap: 6px;
  }

  .control-btn {
    padding: 6px 8px;
    font-size: 0.8rem;
  }

  .control-btn span {
    display: none; /* 在小屏幕上隐藏按钮文字，只显示图标 */
  }

  .mode-selector {
    flex-direction: column;
    gap: 4px;
    min-width: unset;
    max-width: unset;
    width: 100%;
  }

  .mode-button {
    padding: 10px 16px;
    font-size: 0.9rem;
  }
}

/* HTML/Three.js 代码高亮样式 */
.html-comment {
  color: #6a9955;
  font-style: italic;
}

.html-tag {
  color: #569cd6;
}

.html-string {
  color: #ce9178;
}

.html-number {
  color: #b5cea8;
}

.js-keyword {
  color: #c586c0;
  font-weight: bold;
}

.three-class {
  color: #4ec9b0;
  font-weight: bold;
}

.three-method {
  color: #dcdcaa;
}

/* 交互式代码完成提示 */
.threejs-code-notice {
  margin: 15px 0;
  padding: 15px;
  background: linear-gradient(135deg, #10b981, #059669);
  border-radius: 8px;
  color: white;
  border-left: 4px solid #34d399;
}

.notice-content {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.notice-content i {
  font-size: 1.2rem;
  color: #d1fae5;
}

.notice-content span {
  flex: 1;
  font-weight: 500;
}

.view-threejs-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 6px;
  color: white;
  font-size: 0.9rem;
  cursor: pointer;
  transition: all 0.3s ease;
  text-decoration: none;
  white-space: nowrap;
}

.view-threejs-btn:hover {
  background: rgba(255, 255, 255, 0.25);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.view-threejs-btn i {
  font-size: 1rem;
}

/* 交互式模式下的响应区域调整 */
.threejs-mode .response-area {
  border-left-color: #10b981;
}

.threejs-mode .preview-title i {
  color: #10b981;
}

/* 改进代码容器在交互式模式下的样式 */
.threejs-mode .code-container {
  border-left: 3px solid #10b981;
}

.threejs-mode .code-language::after {
  content: " (Three.js)";
  color: #10b981;
  font-size: 0.8rem;
  opacity: 0.8;
}

/* 响应式设计优化 */
@media (max-width: 768px) {
  .notice-content {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .notice-content span {
    text-align: center;
  }

  .view-threejs-btn {
    justify-content: center;
    padding: 10px 16px;
  }
}

/* ===== GeoGebra Viewer Styles ===== */
.geogebra-viewer {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--background-color);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  overflow: hidden;
}

.geogebra-viewer .viewer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 20px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: white;
  border-bottom: 1px solid var(--border-color);
}

.geogebra-viewer .viewer-header h3 {
  margin: 0;
  font-size: 1.2rem;
  display: flex;
  align-items: center;
  gap: 8px;
}

.geogebra-viewer .viewer-controls {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.geogebra-viewer .control-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 8px 12px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  color: white;
  font-size: 0.9rem;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
}

.geogebra-viewer .control-btn:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.2);
  transform: translateY(-1px);
}

.geogebra-viewer .control-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.geogebra-viewer .control-btn.close-btn {
  background: rgba(239, 68, 68, 0.8);
  border-color: rgba(239, 68, 68, 0.4);
}

.geogebra-viewer .control-btn.close-btn:hover {
  background: rgba(239, 68, 68, 1);
}

.geogebra-viewer .viewer-content {
  flex: 1;
  display: flex;
  gap: 10px;
  padding: 10px;
  background: #f8f9fa;
  overflow: hidden;
  min-width: 0;
  min-height: 0;
}

/* 横向 flex 时避免子项被 iframe 固有宽度“撑死”在左侧，导致右侧留白 */
.geogebra-viewer .viewer-content > .geogebra-wrapper {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
}

.geogebra-container {
  flex: 2;
  display: flex;
  flex-direction: column;
  background: white;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  overflow: visible;
}

.geogebra-container .loading-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 450px;
  padding: 40px 20px;
  color: var(--text-secondary);
}

.geogebra-container .loading-state .spinner {
  width: 40px;
  height: 40px;
  border: 4px solid #f3f3f3;
  border-top: 4px solid #f59e0b;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 15px;
}

.geogebra-wrapper {
  display: flex;
  flex-direction: column;
  overflow: visible;
}

#ggb-container,
#ggb-main-container {
  width: 100%;
}

.command-panel {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 350px;
  max-width: 450px;
  background: white;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

.command-status {
  padding: 12px 16px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: white;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.command-status h4 {
  margin: 0 0 8px 0;
  font-size: 1.1rem;
  font-weight: 600;
}

.command-status p {
  margin: 0;
  font-size: 0.9rem;
  opacity: 0.9;
}

.executing-indicator {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: 8px;
  padding: 2px 8px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 12px;
  font-size: 0.8rem;
  font-weight: 500;
}

.executing-indicator::before {
  content: "";
  width: 8px;
  height: 8px;
  background: #10b981;
  border-radius: 50%;
  animation: pulse 1.5s infinite;
}

.command-list {
  flex: 1;
  padding: 12px;
  overflow-y: auto;
  max-height: 300px;
}

.command-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  margin-bottom: 6px;
  border-radius: 6px;
  font-size: 0.9rem;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}

.command-item.pending {
  background: #f8f9fa;
  border-left-color: #e5e7eb;
  color: var(--text-secondary);
}

.command-item.executing {
  background: #fef3c7;
  border-left-color: #f59e0b;
  color: #92400e;
  animation: commandPulse 1.5s infinite;
}

.command-item.executed {
  background: #d1fae5;
  border-left-color: #10b981;
  color: #065f46;
}

.command-number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  background: var(--accent-color);
  color: white;
  border-radius: 50%;
  font-size: 0.8rem;
  font-weight: 600;
  min-width: 24px;
}

.command-item.executed .command-number {
  background: #10b981;
}

.command-item.executing .command-number {
  background: #f59e0b;
}

.command-text {
  flex: 1;
  font-family: "Courier New", monospace;
  word-break: break-all;
}

.command-status-icon {
  font-size: 1.1rem;
  margin-left: auto;
}

.command-status-icon.spinning {
  animation: spin 1s linear infinite;
}

.execution-log {
  border-top: 1px solid var(--border-color);
  padding: 12px;
  background: #f8f9fa;
  max-height: 200px;
  overflow-y: auto;
}

.execution-log h4 {
  margin: 0 0 10px 0;
  font-size: 1rem;
  color: var(--text-color);
}

.log-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.log-item {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 8px 10px;
  border-radius: 4px;
  font-size: 0.8rem;
  border-left: 3px solid;
}

.log-item.success {
  background: #f0fdf4;
  border-left-color: #22c55e;
  color: #166534;
}

.log-item.error {
  background: #fef2f2;
  border-left-color: #ef4444;
  color: #dc2626;
}

.log-time {
  font-weight: 500;
  opacity: 0.8;
}

.log-command {
  font-family: "Courier New", monospace;
  font-weight: 600;
}

.log-message {
  opacity: 0.9;
}

.no-commands {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: var(--text-secondary);
  font-size: 1.1rem;
  padding: 40px 20px;
}

.no-commands i {
  font-size: 3rem;
  margin-bottom: 15px;
  opacity: 0.5;
  color: #f59e0b;
}

.welcome-content {
  text-align: center;
  max-width: 500px;
  margin: 0 auto;
}

.welcome-content h4 {
  color: #f59e0b;
  font-size: 1.4rem;
  margin: 0 0 15px 0;
  font-weight: 600;
}

.welcome-content p {
  margin: 10px 0;
  font-size: 1rem;
  line-height: 1.5;
}

.welcome-content ul {
  text-align: left;
  margin: 15px 0;
  padding-left: 20px;
}

.welcome-content li {
  margin: 8px 0;
  font-size: 0.95rem;
  line-height: 1.4;
}

.example-hints {
  margin-top: 20px;
  padding: 15px;
  background: rgba(245, 158, 11, 0.1);
  border-radius: 8px;
  border-left: 4px solid #f59e0b;
}

.example-hints p {
  margin: 8px 0;
}

.example-hints p:first-child {
  font-weight: 600;
  color: #f59e0b;
  margin-bottom: 12px;
}

.example-hints p:not(:first-child) {
  font-family: "Courier New", monospace;
  font-size: 0.9rem;
  background: rgba(255, 255, 255, 0.8);
  padding: 6px 10px;
  border-radius: 4px;
  margin: 6px 0;
  border-left: 2px solid #f59e0b;
}

/* GeoGebra模式特定样式 */
.geogebra-preview {
  border-left: 3px solid #f59e0b;
}

.geogebra-preview .preview-title i {
  color: #f59e0b;
}

/* 动画效果 */
@keyframes commandPulse {
  0%,
  100% {
    transform: scale(1);
    background: #fef3c7;
  }
  50% {
    transform: scale(1.02);
    background: #fde68a;
  }
}

/* 响应式设计 */
@media (max-width: 1200px) {
  .geogebra-viewer .viewer-content {
    flex-direction: column;
    gap: 10px;
  }

  .command-panel {
    min-width: auto;
    max-width: none;
    max-height: 350px;
    flex: 0 0 auto;
  }

  .geogebra-container {
    flex: 1 1 auto;
  }
}

@media (max-width: 768px) {
  .geogebra-viewer .viewer-header {
    padding: 10px 12px;
    flex-wrap: nowrap;
    gap: 8px;
  }

  .geogebra-viewer .viewer-header h3 {
    font-size: 1.1rem;
    flex-shrink: 0;
    min-width: auto;
  }

  .geogebra-viewer .viewer-controls {
    gap: 6px;
    flex-wrap: nowrap;
    flex: 1;
    justify-content: flex-end;
    overflow-x: auto;
  }

  .geogebra-viewer .control-btn {
    padding: 8px 10px;
    font-size: 0.9rem;
    min-width: 36px;
    flex-shrink: 0;
  }

  .geogebra-viewer .control-btn span {
    display: none; /* 在小屏幕上隐藏按钮文字 */
  }
  
  .geogebra-viewer .control-btn i {
    margin: 0;
    font-size: 1.1rem;
  }

  .geogebra-viewer .viewer-content {
    padding: 8px;
    gap: 8px;
    flex-direction: column;
  }

  .command-panel {
    max-height: 250px;
    flex: 0 0 auto;
  }

  .command-list {
    max-height: 180px;
  }

  .execution-log {
    max-height: 120px;
  }

  .geogebra-container {
    flex: 1 1 auto;
  }
}

/* GeoGebra指令代码高亮 */
.geogebra-command {
  color: #8b5cf6;
  font-weight: bold;
}

.geogebra-parameter {
  color: #059669;
}

.geogebra-string {
  color: #dc2626;
}

.geogebra-number {
  color: #2563eb;
}

.geogebra-variable {
  color: #f59e0b;
  font-weight: bold;
}

.geogebra-comment {
  color: #6b7280;
  font-style: italic;
}

.geogebra-viewer.fullscreen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 2000;
  background-color: var(--background-color, #f0f2f5);
  padding: 20px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  border-radius: 0;
  box-shadow: none;
}

.geogebra-viewer.fullscreen .viewer-content {
  flex: 1 1 auto;
  flex-grow: 1;
  min-width: 0;
  min-height: 0;
  width: 100%;
  box-sizing: border-box;
}

/* 全屏时 viewer-content 为横向 flex，子项默认 min-width:auto 会按 iframe 内容宽度收缩，
   导致画板只占左半屏、右侧留白 —— 强制铺满并允许收缩 */
.geogebra-viewer.fullscreen .geogebra-wrapper {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

/* GeoGebra 注入的根节点在容器 div 内，保证其占满 wrapper */
.geogebra-viewer.fullscreen .geogebra-wrapper > div:first-child {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

.community-section {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  padding: 2rem 0;
  width: 100%;
}

.community-image {
  width: 150px;
  height: 150px;
  border-radius: 8px;
  object-fit: cover;
  border: 2px solid var(--tech-line-color);
}

.community-text {
  text-align: left;
  max-width: 400px;
}

.community-text h3 {
  font-size: 1.5rem;
  color: var(--accent-color);
  margin-bottom: 0.5rem;
}

.community-text p {
  font-size: 1rem;
  color: var(--text-secondary);
}

@media (max-width: 768px) {
  .community-section {
    flex-direction: column;
    text-align: center;
  }

  .community-text {
    text-align: center;
  }
}

.community-image:hover {
  transform: scale(1.05);
  border-color: var(--accent-color);
  cursor: pointer;
  transition: var(--transition-normal);
}

/* 图片放大模-态框样式 */
.image-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10000;
  backdrop-filter: blur(5px);
  animation: fadeIn 0.3s ease;
}

.image-modal-content {
  position: relative;
  text-align: center;
  background: var(--secondary-color);
  padding: 2rem;
  border-radius: var(--card-radius);
  box-shadow: 0 10px 30px var(--shadow-strong);
}

.enlarged-community-image {
  max-width: 80vw;
  max-height: 70vh;
  object-fit: contain;
  border-radius: 8px;
}

.scan-hint {
  color: var(--text-color);
  font-size: 1.2rem;
  margin-top: 1rem;
  font-weight: 500;
}

.close-modal-btn {
  position: absolute;
  top: -15px;
  right: -15px;
  background: var(--accent-color);
  color: white;
  border: none;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  font-size: 1.5rem;
  line-height: 28px;
  text-align: center;
  cursor: pointer;
  box-shadow: 0 4px 10px var(--shadow-strong);
  transition: var(--transition-fast);
}

.close-modal-btn:hover {
  background: var(--error-color);
  color: white;
}

/* 渲染错误和修复按钮样式 */
.render-error-container {
  background-color: rgba(255, 82, 82, 0.1);
  border: 1px solid rgba(255, 82, 82, 0.2);
  border-left: 4px solid var(--error-color);
  border-radius: 8px;
  padding: 1rem;
  margin-top: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  animation: fadeIn 0.5s ease;
}

.render-error-container .error-message {
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  color: var(--error-color);
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.render-error-container .error-message i {
  font-size: 1.2rem;
}

.fix-button {
  background-color: var(--accent-color);
  color: var(--text-color);
  border: none;
  border-radius: 6px;
  padding: 0.75rem 1.5rem;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--transition-normal);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  align-self: flex-start; /* Align button to the left */
}

.fix-button:hover:not(:disabled) {
  background-color: var(--accent-hover);
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(79, 109, 245, 0.3);
}

.fix-button:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

.fix-button i.rotating {
  animation: spin 1s linear infinite;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* New User Guide Modal */
.new-user-guide-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2000;
  backdrop-filter: blur(5px);
}

.new-user-guide-modal-content {
  background: linear-gradient(145deg, #1f2428, #101214);
  color: #e0e0e0;
  padding: 30px 40px;
  border-radius: 15px;
  max-width: 600px;
  width: 90%;
  border: 1px solid rgba(0, 122, 255, 0.4);
  box-shadow: 0 0 25px rgba(0, 122, 255, 0.2);
  position: relative;
  animation: fadeInScaleUp 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.new-user-guide-modal-content h2 {
  color: #00aaff;
  text-align: center;
  margin-top: 0;
  margin-bottom: 15px;
  font-size: 24px;
}

.new-user-guide-modal-content p {
  line-height: 1.6;
  margin-bottom: 20px;
}

.new-user-guide-modal-content .guide-section {
  margin-bottom: 25px;
  padding-left: 15px;
  border-left: 3px solid rgba(0, 122, 255, 0.5);
}

.new-user-guide-modal-content .guide-section h3 {
  margin-top: 0;
  margin-bottom: 10px;
  color: #99ddff;
  font-size: 18px;
}

.new-user-guide-modal-content ul {
  list-style-type: none;
  padding-left: 0;
}

.new-user-guide-modal-content li {
  margin-bottom: 10px;
  padding-left: 10px;
  position: relative;
}

.new-user-guide-modal-content li::before {
  content: "▶";
  position: absolute;
  left: -10px;
  color: #00aaff;
  font-size: 12px;
}

.new-user-guide-modal-content .guide-link {
  color: #00aaff;
  text-decoration: none;
  font-weight: bold;
  border-bottom: 1px dashed #00aaff;
  transition: all 0.3s ease;
}

.new-user-guide-modal-content .guide-link:hover {
  color: #fff;
  background-color: #00aaff;
  border-bottom-color: #fff;
}

.new-user-guide-modal-content .recharge-btn {
  margin-right: 10px;
}

.new-user-guide-modal-content small {
  color: #aaa;
  font-style: italic;
}

.new-user-guide-modal-content .guide-close-btn {
  display: block;
  width: 100%;
  padding: 12px;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  background: linear-gradient(45deg, #007bff, #00aaff);
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  margin-top: 20px;
  box-shadow: 0 4px 15px rgba(0, 122, 255, 0.3);
}

.new-user-guide-modal-content .guide-close-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 122, 255, 0.5);
}

.image-modal-overlay .close-modal-btn {
  top: 15px;
  right: 15px;
  width: 40px;
  height: 40px;
  font-size: 28px;
}

.new-user-guide-modal-content .close-modal-btn {
  position: absolute;
  top: 10px;
  right: 15px;
  background: none;
  border: none;
  color: #888;
  font-size: 30px;
  cursor: pointer;
  transition: color 0.3s ease;
}

.new-user-guide-modal-content .close-modal-btn:hover {
  color: #fff;
}

/* === Mobile Optimizations (2024-07-10) === */
@media (max-width: 768px) {
  /* 在中小屏幕上保持用户信息水平排列，避免按钮遮挡 */
  .user-info {
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
  }
  /* 允许元素换行，防止宽度不足时重叠 */
  .user-controls {
    flex-wrap: wrap;
  }
}

@media (max-width: 480px) {
  /* 1. 适配新手指南弹窗尺寸，确保关闭按钮可见 */
  .new-user-guide-modal-content {
    max-height: 90vh; /* 始终在视口内 */
    overflow-y: auto; /* 内容过长时滚动 */
    padding: 20px 15px; /* 缩小内边距提高可视面积 */
  }
  .new-user-guide-modal-content .close-modal-btn {
    top: 8px; /* 略微下移，避免被状态栏遮挡 */
    right: 10px;
    font-size: 28px;
  }

  /* 2. 将用户控制区域改为垂直排列，彻底避免两个按钮重叠 */
  .user-controls {
    position: relative; /* 取消绝对定位带来的布局挤压 */
    top: 0;
    right: 0;
    width: 100%;
    flex-direction: column; /* 垂直堆叠 */
    align-items: flex-end;
    gap: 0.5rem;
    margin-top: 0.5rem;
  }
}

/* 顶部右侧用户信息和退出 */
.top-right-user-info {
  position: fixed;
  top: 55px;
  right: 30px;
  z-index: 1200;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.top-right-user-info .logout-btn,
.top-right-user-info .change-password-btn {
  position: relative;
  top: auto;
  right: auto;
}

/* 用户名按钮样式 */
.top-right-user-info .username-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.1), rgba(139, 92, 246, 0.1));
  color: var(--text-color);
  border: 1px solid rgba(88, 101, 242, 0.3);
  border-radius: 8px;
  font-size: 0.9rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  text-align: center;
}

.top-right-user-info .username-btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
  transition: left 0.5s ease;
}

.top-right-user-info .username-btn:hover {
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.2), rgba(139, 92, 246, 0.2));
  border-color: rgba(88, 101, 242, 0.5);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(88, 101, 242, 0.3);
}

.top-right-user-info .username-btn:hover::before {
  left: 100%;
}

.top-right-user-info .username-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(88, 101, 242, 0.2);
}

.top-right-user-info .username-btn i {
  font-size: 1.1rem;
  color: var(--primary-color);
}

.top-right-user-info .username-btn span {
  text-align: center;
  white-space: nowrap;
}

@media (max-width: 768px) {
  .top-right-user-info {
    top: 15px;
    right: 20px;
    font-size: 0.85rem;
    gap: 0.5rem;
  }
  
  .top-right-user-info .username-btn {
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
  }
  
  .top-right-user-info .username-btn span {
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

@media (max-width: 480px) {
  .top-right-user-info .username-btn span {
    display: none;
  }
  
  .top-right-user-info .username-btn {
    padding: 0.5rem;
    min-width: auto;
  }
}

/* 保证新手指南关闭按钮始终可见 */
.new-user-guide-modal-content .close-modal-btn {
  position: sticky; /* 相对滚动容器固定 */
  top: 10px;
  margin-left: auto; /* 右对齐 */
  z-index: 2100; /* 高于内容 */
}

@media (max-width: 480px) {
  .new-user-guide-modal-content .close-modal-btn {
    top: 6px;
    right: 0; /* 确保粘贴右侧 */
  }
}

@media (max-width: 480px) {
  .new-user-guide-modal-content .close-modal-btn {
    top: 5px;
    right: 5px;
  }
}

/* Announcement Modal Styles */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.75);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2000;
  animation: fadeIn 0.3s ease;
}

.modal-content {
  background: var(--secondary-color);
  padding: 2rem;
  border-radius: var(--card-radius);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
  width: 90%;
  max-width: 600px;
  max-height: 80vh;
  overflow-y: auto;
  position: relative;
  border-top: 4px solid var(--accent-color);
  animation: slideIn 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.modal-content h2 {
  text-align: center;
  color: var(--accent-color);
  margin-bottom: 1.5rem;
}

.announcement-list {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.announcement-item {
  background-color: var(--dark-gray);
  padding: 1.5rem;
  border-radius: 8px;
  border-left: 3px solid var(--accent-color);
}

.announcement-item h3 {
  margin-bottom: 0.5rem;
  color: var(--text-color);
}

.announcement-item p {
  color: var(--text-secondary);
  line-height: 1.6;
  margin-bottom: 0.75rem;
}

.announcement-item span {
  font-size: 0.8rem;
  color: var(--text-secondary);
  opacity: 0.7;
  text-align: right;
  display: block;
}

@keyframes slideIn {
  from {
    transform: translateY(-50px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

/* Community CTA in Announcement Modal */
.community-cta {
  background: linear-gradient(
    135deg,
    rgba(79, 109, 245, 0.1),
    rgba(79, 109, 245, 0.2)
  );
  border-color: var(--accent-color);
  text-align: center;
  padding: 2rem;
}

.community-cta h3 {
  color: var(--accent-color);
}

.join-community-btn {
  background-color: var(--accent-color);
  color: white;
  border: none;
  border-radius: 8px;
  padding: 0.8rem 1.6rem;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1rem;
  box-shadow: 0 4px 15px rgba(79, 109, 245, 0.3);
}

.join-community-btn:hover {
  background-color: var(--accent-hover);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(79, 109, 245, 0.5);
}

.join-community-btn i {
  font-size: 1.2rem;
}

/* === Fix Modal Overlay (3D Render Error) === */
.fix-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.75);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2200;
  backdrop-filter: blur(5px);
  animation: fadeIn 0.3s ease;
}

.fix-modal-content {
  background: var(--secondary-color);
  padding: 2rem;
  border-radius: var(--card-radius);
  box-shadow: 0 10px 30px var(--shadow-strong);
  width: 90%;
  max-width: 500px;
  position: relative;
  text-align: center;
  border-top: 4px solid var(--accent-color);
  animation: slideIn 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.fix-modal-content .error-message {
  color: var(--error-color);
  font-weight: 500;
  margin-bottom: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.fix-modal-content .fix-button {
  margin: 0 auto;
}

/* === Voiceover Toast (旁白音频选择小提示) === */
.voiceover-modal-overlay {
  position: fixed;
  bottom: 120px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3000;
  pointer-events: none; /* 允许点击底层 */
  animation: slideUpFade 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  /* 覆盖之前可能导致全屏的样式 */
  width: max-content !important;
  height: max-content !important;
  background: transparent !important;
  backdrop-filter: none !important;
}

.voiceover-modal {
  background: var(--secondary-color);
  padding: 0.6rem 0.8rem;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.6rem;
  pointer-events: auto; /* 恢复弹窗自身的点击 */
  border: 1px solid rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(10px);
  width: auto;
  max-width: none;
}

.voiceover-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

.voiceover-modal-icon {
  display: none; /* 隐藏大图标 */
}

.voiceover-modal-title {
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--text-color);
  margin: 0;
  white-space: nowrap;
}

.voiceover-header-actions {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.voiceover-voice-select {
  background: rgba(0, 0, 0, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 6px;
  color: var(--text-color);
  font-size: 0.75rem;
  padding: 0.2rem 0.4rem;
  outline: none;
  cursor: pointer;
  transition: border-color 0.2s;
  max-width: 180px;
}

.voiceover-voice-select optgroup {
  background: var(--secondary-color);
  color: var(--text-color);
  font-weight: 600;
  font-size: 0.75rem;
}

.voiceover-voice-select option {
  background: var(--secondary-color);
  color: var(--text-color);
  font-weight: normal;
}

.voiceover-voice-select:focus {
  border-color: var(--accent-color);
}

.voiceover-modal-actions {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
}

.voiceover-btn-primary,
.voiceover-btn-secondary {
  flex: 1;
  padding: 0.35rem 0;
  font-size: 0.8rem;
  border-radius: 8px;
  font-weight: 500;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.3rem;
}

.voiceover-btn-primary {
  background: linear-gradient(135deg, var(--accent-color), #8b5cf6);
  color: white;
  border: none;
}

.voiceover-btn-secondary {
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-secondary);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.voiceover-toast-close {
  background: transparent;
  border: none;
  color: var(--text-secondary);
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  margin: 0;
  transition: color 0.2s;
}

.voiceover-toast-close:hover {
  color: var(--text-color);
}

.voiceover-modal.bubble-tail {
  position: relative;
}

.voiceover-modal.bubble-tail::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  border-width: 8px 8px 0;
  border-style: solid;
  border-color: var(--secondary-color) transparent transparent transparent;
  filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.2));
}

@keyframes slideUpFade {
  from {
    opacity: 0;
    transform: translate(-50%, 10px);
  }
  to {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}

/* Loading Overlay Styles */
.loading-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(12, 16, 29, 0.97);
  z-index: 2000; /* Ensure it covers everything, including InputArea with z-index 1000 */
  display: flex;
  align-items: center;
  flex-direction: column;
  border-radius: 15px;
  padding: 24px 16px;
  box-sizing: border-box;
  backdrop-filter: blur(8px);
  opacity: 0;
  animation: fadeIn 0.3s forwards;
  overflow-y: auto;
  overflow-x: hidden;
}

.loading-overlay::-webkit-scrollbar {
  width: 6px;
}

.loading-overlay::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.15);
  border-radius: 3px;
}

.loading-overlay-content {
  text-align: center;
  width: 95%;
  max-width: 980px;
  margin: auto 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.loading-progress-bar-container {
  width: 100%;
  height: 6px;
  background-color: rgba(255, 255, 255, 0.15);
  border-radius: 3px;
  margin-bottom: 25px;
  overflow: hidden;
  position: relative;
}

.loading-progress-bar {
  position: absolute;
  top: 0;
  left: 0;
  width: 0%;
  height: 100%;
  background: linear-gradient(
    90deg,
    rgba(0, 122, 255, 0.2),
    rgba(0, 180, 255, 1),
    rgba(0, 122, 255, 0.2)
  );
  border-radius: 3px;
  box-shadow: 0 0 10px rgba(0, 180, 255, 0.6);
  transition: width 0.4s ease;
}

@keyframes loading-progress-animation {
  0% {
    transform: translateX(-100%);
  }
  50% {
    transform: translateX(200%);
  }
  100% {
    transform: translateX(-100%);
  }
}

.loading-text {
  color: #e0e0e0;
  font-size: 16px;
  font-weight: 500;
  text-shadow: 0 0 8px rgba(0, 180, 255, 0.5);
}

.loading-progress-info {
  color: #bfe9ff;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 12px;
  text-shadow: 0 0 6px rgba(0, 180, 255, 0.5);
}

.loading-brand {
  font-family: "Orbitron", sans-serif;
  font-size: 2.5rem;
  font-weight: 700;
  color: #ffffff;
  text-shadow: 0 0 8px rgba(0, 170, 255, 0.5), 0 0 12px rgba(0, 170, 255, 0.3);
  margin-bottom: 25px;
  letter-spacing: 3px;
  animation: flicker 2s infinite alternate;
}

@keyframes flicker {
  0%,
  18%,
  22%,
  25%,
  53%,
  57%,
  100% {
    opacity: 1;
    text-shadow: 0 0 4px #fff, 0 0 11px #fff, 0 0 19px #fff, 0 0 40px #0af,
      0 0 80px #0af, 0 0 90px #0af;
  }
  20%,
  24%,
  55% {
    opacity: 0.8;
    text-shadow: none;
  }
}

.loading-progress-bar-container {
  width: 100%;
  height: 6px;
  background-color: rgba(255, 255, 255, 0.15);
  border-radius: 3px;
  margin-bottom: 25px;
  overflow: hidden;
  position: relative;
}

.loading-progress-bar {
  position: absolute;
  top: 0;
  left: 0;
  width: 0%;
  height: 100%;
  background: linear-gradient(
    90deg,
    rgba(0, 122, 255, 0.2),
    rgba(0, 180, 255, 1),
    rgba(0, 122, 255, 0.2)
  );
  border-radius: 3px;
  box-shadow: 0 0 10px rgba(0, 180, 255, 0.6);
  transition: width 0.4s ease;
}

@keyframes loading-progress-animation {
  0% {
    transform: translateX(-100%);
  }
  50% {
    transform: translateX(200%);
  }
  100% {
    transform: translateX(-100%);
  }
}

.loading-text {
  color: #e0e0e0;
  font-size: 16px;
  font-weight: 500;
  text-shadow: 0 0 8px rgba(0, 180, 255, 0.5);
}

.tech-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5),
    0 0 25px rgba(0, 122, 255, 0.4) inset;
}

/* ==================== 水印下载弹窗样式 ==================== */

/* 视频控制按钮容器 */
.video-controls {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
  margin-top: 15px;
}

/* 下载按钮样式 */
.download-btn {
  background: linear-gradient(135deg, #4caf50 0%, #2e7d32 100%);
  color: white;
  border: none;
  border-radius: 8px;
  padding: 12px 24px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(76, 175, 80, 0.3);
}

.download-btn:hover {
  background: linear-gradient(135deg, #66bb6a 0%, #388e3c 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(76, 175, 80, 0.4);
}

.download-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(76, 175, 80, 0.3);
}

.download-btn i {
  font-size: 16px;
}

/* 水印弹窗遮罩层 */
.watermark-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10000;
  animation: fadeIn 0.3s ease-in-out;
}

/* 水印弹窗内容容器 */
.watermark-modal-content {
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
  border-radius: 16px;
  border: 1px solid rgba(79, 109, 245, 0.3);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.6),
    0 0 0 1px rgba(255, 255, 255, 0.1) inset;
  max-width: 500px;
  width: 90vw;
  max-height: 90vh;
  overflow: hidden;
  animation: slideUp 0.3s ease-out;
  position: relative;
}

/* 水印弹窗头部 */
.watermark-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px 16px;
  border-bottom: 1px solid rgba(79, 109, 245, 0.2);
}

.watermark-modal-header h3 {
  margin: 0;
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--text-primary);
  display: flex;
  align-items: center;
  gap: 10px;
}

.watermark-modal-header h3 i {
  color: var(--accent-color);
  font-size: 1.4rem;
}

/* 水印弹窗主体 */
.watermark-modal-body {
  padding: 24px;
}

.watermark-modal-body p {
  margin: 0 0 20px 0;
  color: var(--text-secondary);
  font-size: 1rem;
  line-height: 1.5;
}

/* 水印输入组 */
.watermark-input-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.watermark-input-group label {
  font-weight: 600;
  color: var(--text-primary);
  font-size: 0.95rem;
}

.watermark-input {
  width: 100%;
  padding: 12px 16px;
  border: 2px solid rgba(79, 109, 245, 0.3);
  border-radius: 8px;
  background-color: rgba(79, 109, 245, 0.05);
  color: var(--text-primary);
  font-size: 1rem;
  transition: all 0.3s ease;
  box-sizing: border-box;
}

.watermark-input:focus {
  outline: none;
  border-color: var(--accent-color);
  background-color: rgba(79, 109, 245, 0.1);
  box-shadow: 0 0 0 3px rgba(79, 109, 245, 0.1);
}

.watermark-input::placeholder {
  color: var(--text-tertiary);
}

.watermark-hint {
  color: var(--text-tertiary);
  font-size: 0.85rem;
  line-height: 1.4;
  margin-top: 4px;
}

/* 水印弹窗底部 */
.watermark-modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 24px 24px;
  border-top: 1px solid rgba(79, 109, 245, 0.2);
}

/* 弹窗按钮样式 */
.btn-secondary {
  background: transparent;
  color: var(--text-secondary);
  border: 2px solid rgba(79, 109, 245, 0.3);
  border-radius: 8px;
  padding: 10px 20px;
  cursor: pointer;
  font-size: 0.95rem;
  font-weight: 600;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 6px;
}

.btn-secondary:hover:not(:disabled) {
  background-color: rgba(79, 109, 245, 0.1);
  border-color: rgba(79, 109, 245, 0.5);
  color: var(--text-primary);
}

.btn-primary {
  background: linear-gradient(135deg, var(--accent-color) 0%, #3d5afe 100%);
  color: white;
  border: none;
  border-radius: 8px;
  padding: 12px 24px;
  cursor: pointer;
  font-size: 0.95rem;
  font-weight: 600;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 4px 12px rgba(79, 109, 245, 0.3);
}

.btn-primary:hover:not(:disabled) {
  background: linear-gradient(135deg, #5c6bc0 0%, #3f51b5 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(79, 109, 245, 0.4);
}

.btn-primary:active:not(:disabled) {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(79, 109, 245, 0.3);
}

.btn-primary:disabled,
.btn-secondary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none !important;
}

.btn-primary i,
.btn-secondary i {
  font-size: 1rem;
}

/* 旋转动画 */
.rotating {
  animation: rotate 1s linear infinite;
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* 弹窗动画 */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(30px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* 响应式设计 */
@media (max-width: 600px) {
  .watermark-modal-content {
    margin: 20px;
    width: calc(100vw - 40px);
  }

  .watermark-modal-header,
  .watermark-modal-body,
  .watermark-modal-footer {
    padding-left: 16px;
    padding-right: 16px;
  }

  .watermark-modal-footer {
    flex-direction: column;
    gap: 8px;
  }

  .btn-primary,
  .btn-secondary {
    width: 100%;
    justify-content: center;
  }
}

/* 平板设备响应式样式 */
@media (max-width: 1024px) and (min-width: 769px) {
  .mode-selector {
    min-width: 500px;
    max-width: 700px;
  }
}

/* 移动端响应式样式 */
@media (max-width: 768px) {
  .mode-selector {
    flex-direction: column;
    gap: 8px;
    padding: 8px;
    min-width: unset;
    max-width: unset;
    width: 100%;
  }

  .mode-button {
    padding: 16px 20px;
    flex-direction: row;
    justify-content: flex-start;
    gap: 12px;
  }

  .mode-info {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }

  .mode-name {
    font-size: 1rem;
  }

  .mode-credits {
    font-size: 0.7rem;
    padding: 3px 6px;
  }

  .credit-explanation-modal-content {
    padding: 20px;
    margin: 10px;
    max-height: 85vh;
  }

  .credit-explanation-modal-content h2 {
    font-size: 1.3rem;
  }

  .mode-comparison {
    gap: 8px;
  }

  .comparison-item {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .mode-tag {
    min-width: auto;
    width: 100%;
  }

  .process {
    font-size: 0.8rem;
    text-align: center;
  }
}

@media (max-width: 480px) {
  .mode-button {
    padding: 14px 16px;
  }

  .mode-name {
    font-size: 0.9rem;
  }

  .mode-credits {
    font-size: 0.65rem;
    padding: 2px 5px;
  }

  .credit-explanation-modal-content {
    padding: 16px;
    margin: 5px;
  }

  .explanation-section h3 {
    font-size: 1rem;
  }

  .explanation-section p,
  .explanation-section li {
    font-size: 0.9rem;
  }

  /* 简化版弹窗移动端适配 */
  .credit-explanation-modal-content.simple {
    max-width: 350px;
    padding: 30px 20px;
  }

  .expensive-meme {
    width: 150px;
  }

  .guess-text-cn {
    font-size: 1.6rem;
  }

  .guess-text-en {
    font-size: 1rem;
    letter-spacing: 1px;
  }
}

/* ================== 优化后的社群弹窗样式 ================== */
.image-modal-content.community-enhanced {
  max-width: 800px;
  width: 90vw;
  max-height: 90vh;
  overflow-y: auto;
  padding: 2.5rem;
  background: linear-gradient(
    135deg,
    var(--secondary-color) 0%,
    rgba(79, 109, 245, 0.1) 100%
  );
  border: 1px solid rgba(79, 109, 245, 0.3);
}

.modal-header {
  text-align: center;
  margin-bottom: 2rem;
}

.modal-title {
  color: var(--text-color);
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 1rem;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.highlight-banner-group {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 18px;
  flex-wrap: wrap;
  margin: 0 auto 1.5rem;
}

.highlight-banner {
  background: linear-gradient(
    90deg,
    var(--accent-color),
    #ff6b6b,
    var(--accent-color)
  );
  background-size: 200% 100%;
  animation: gradientShift 3s ease-in-out infinite;
  border-radius: 25px;
  padding: 14px 20px;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 200px;
  max-width: 260px;
  flex: 1 1 220px;
  box-shadow: 0 8px 25px rgba(79, 109, 245, 0.4);
  border: 2px solid rgba(255, 255, 255, 0.2);
  position: relative;
  overflow: hidden;
}

.highlight-banner::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.3),
    transparent
  );
  animation: shimmer 2s infinite;
}

@keyframes gradientShift {
  0%,
  100% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}

@keyframes shimmer {
  0% {
    left: -100%;
  }
  100% {
    left: 100%;
  }
}

.big-number {
  display: block;
  font-size: 2.5rem;
  font-weight: 900;
  color: white;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
  letter-spacing: 2px;
}

.highlight-text {
  display: block;
  font-size: 1.1rem;
  color: white;
  font-weight: 600;
  margin-top: 5px;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

.honor-section {
  margin: 2rem 0;
  padding: 2rem;
  background: linear-gradient(
    135deg,
    rgba(255, 215, 0, 0.1) 0%,
    rgba(255, 140, 0, 0.05) 100%
  );
  border-radius: 20px;
  border: 2px solid rgba(255, 215, 0, 0.3);
  text-align: center;
  position: relative;
  overflow: hidden;
}

.honor-section::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    45deg,
    transparent,
    rgba(255, 215, 0, 0.1),
    transparent
  );
  animation: honorGlow 4s ease-in-out infinite;
  pointer-events: none;
}

@keyframes honorGlow {
  0%,
  100% {
    transform: rotate(0deg);
    opacity: 0.3;
  }
  50% {
    transform: rotate(180deg);
    opacity: 0.7;
  }
}

.honor-title {
  color: #ffd700;
  font-size: 1.5rem;
  font-weight: bold;
  margin-bottom: 1.5rem;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  position: relative;
  z-index: 2;
}

.honor-achievement {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  margin-bottom: 1.5rem;
  position: relative;
  z-index: 2;
}

.honor-image {
  max-width: 200px;
  max-height: 300px;
  border-radius: 15px;
  box-shadow: 0 8px 25px rgba(255, 215, 0, 0.3);
  border: 3px solid rgba(255, 215, 0, 0.5);
  transition: all 0.3s ease;
}

.honor-image:hover {
  transform: scale(1.05);
  box-shadow: 0 12px 35px rgba(255, 215, 0, 0.5);
}

.honor-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.honor-label {
  background: linear-gradient(90deg, #ffd700, #ffa500);
  color: #000;
  padding: 8px 20px;
  border-radius: 25px;
  font-weight: bold;
  font-size: 1.1rem;
  box-shadow: 0 4px 15px rgba(255, 215, 0, 0.4);
  animation: labelPulse 2s ease-in-out infinite;
}

@keyframes labelPulse {
  0%,
  100% {
    transform: scale(1);
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.4);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 6px 20px rgba(255, 215, 0, 0.6);
  }
}

.honor-desc {
  color: #ffd700;
  font-size: 1rem;
  font-weight: 600;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.honor-text {
  color: var(--text-color);
  font-size: 1.1rem;
  line-height: 1.6;
  margin: 0;
  position: relative;
  z-index: 2;
}

.honor-text strong {
  color: #ffd700;
  font-weight: bold;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.community-benefits {
  margin: 2rem 0;
  padding: 1.5rem;
  background: rgba(79, 109, 245, 0.05);
  border-radius: 15px;
  border: 1px solid rgba(79, 109, 245, 0.2);
}

.benefits-title {
  color: var(--accent-color);
  font-size: 1.4rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 1.5rem;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.benefits-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}

.benefit-item {
  display: flex;
  align-items: center;
  padding: 12px 15px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 10px;
  border: 1px solid rgba(79, 109, 245, 0.15);
  transition: all 0.3s ease;
  cursor: default;
}

.benefit-item:hover {
  background: rgba(79, 109, 245, 0.1);
  border-color: rgba(79, 109, 245, 0.3);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(79, 109, 245, 0.2);
}

.benefit-icon {
  font-size: 1.5rem;
  margin-right: 12px;
  min-width: 30px;
}

.benefit-text {
  color: var(--text-color);
  font-size: 0.95rem;
  font-weight: 500;
  line-height: 1.4;
}

.action-guide {
  margin-top: 2rem;
  padding: 1.5rem;
  background: rgba(76, 175, 80, 0.05);
  border-radius: 15px;
  border: 1px solid rgba(76, 175, 80, 0.2);
}

.guide-title {
  color: var(--success-color);
  font-size: 1.3rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 1.5rem;
}

.steps {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.step {
  display: flex;
  align-items: center;
  padding: 15px;
  background: rgba(76, 175, 80, 0.08);
  border-radius: 10px;
  border-left: 4px solid var(--success-color);
}

.step-number {
  background: var(--success-color);
  color: white;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  margin-right: 15px;
  font-size: 0.9rem;
}

.step-text {
  color: var(--text-color);
  font-size: 1rem;
  font-weight: 500;
}

.urgent-notice {
  text-align: center;
  color: #ff6b6b;
  font-size: 1.1rem;
  padding: 15px;
  background: rgba(255, 107, 107, 0.1);
  border-radius: 10px;
  border: 1px solid rgba(255, 107, 107, 0.3);
  margin: 0;
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0%,
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255, 107, 107, 0.4);
  }
  50% {
    transform: scale(1.02);
    box-shadow: 0 0 0 10px rgba(255, 107, 107, 0);
  }
}

/* 响应式设计 */
@media (max-width: 768px) {
  .image-modal-content.community-enhanced {
    padding: 1.5rem;
    margin: 1rem;
    width: calc(100vw - 2rem);
  }

  .modal-title {
    font-size: 1.6rem;
  }

  .big-number {
    font-size: 2rem;
  }

  .benefits-grid {
    grid-template-columns: 1fr;
  }

  .steps {
    gap: 0.8rem;
  }

  .step {
    padding: 12px;
  }

  .step-number {
    width: 25px;
    height: 25px;
    font-size: 0.8rem;
    margin-right: 12px;
  }

  .honor-section {
    padding: 1.5rem;
    margin: 1.5rem 0;
  }

  .honor-title {
    font-size: 1.3rem;
  }

  .honor-achievement {
    flex-direction: column;
    gap: 1rem;
    text-align: center;
  }

  .honor-image {
    max-width: 150px;
    max-height: 200px;
  }

  .honor-label {
    font-size: 1rem;
    padding: 6px 16px;
  }

  .honor-desc {
    font-size: 0.9rem;
  }

  .honor-text {
    font-size: 1rem;
  }
}

/* ================================
   锤锤解题模式样式
   ================================ */

/* 视频讲解按钮区域 */
.video-generate-section {
  padding: 20px;
  border-top: 1px solid rgba(0, 122, 255, 0.2);
  margin-top: 20px;
  background: linear-gradient(
    135deg,
    rgba(0, 122, 255, 0.05),
    rgba(64, 224, 208, 0.05)
  );
  border-radius: 0 0 15px 15px;
  text-align: center;
}

.video-generate-btn {
  background: linear-gradient(135deg, #007aff, #40e0d0);
  color: white;
  border: none;
  border-radius: 25px;
  padding: 12px 30px;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 4px 15px rgba(0, 122, 255, 0.3);
  position: relative;
  overflow: hidden;
}

.video-generate-btn:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 122, 255, 0.4);
  background: linear-gradient(135deg, #0056cc, #36c7b8);
}

.video-generate-btn:disabled {
  opacity: 0.7;
  cursor: not-allowed;
  transform: none;
}

.video-generate-btn i.rotating {
  animation: spin 1s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* 视频播放器面板 */
.video-drawer {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height 0.6s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.5s ease-in-out, margin-top 0.4s ease;
  margin-top: 0;
}

.video-drawer.open {
  max-height: 1200px; /* 足够大的高度以容纳内容 */
  opacity: 1;
  margin-top: 20px;
}

.video-preview {
  min-height: 400px;
  display: flex;
  flex-direction: column;
}

.video-player-container {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.video-player-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 20px;
  border-bottom: 1px solid rgba(0, 122, 255, 0.2);
  background: linear-gradient(
    135deg,
    rgba(0, 122, 255, 0.1),
    rgba(64, 224, 208, 0.1)
  );
}

.video-player-header h3 {
  color: #007aff;
  font-size: 18px;
  font-weight: bold;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.close-button {
  background: rgba(255, 59, 48, 0.1);
  border: 1px solid rgba(255, 59, 48, 0.3);
  color: #ff3b30;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
}

.close-button:hover {
  background: rgba(255, 59, 48, 0.2);
  transform: scale(1.1);
}

/* 视频占位符 */
.video-placeholder {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(
    135deg,
    rgba(0, 122, 255, 0.02),
    rgba(64, 224, 208, 0.02)
  );
  border: 2px dashed rgba(0, 122, 255, 0.2);
  border-radius: 15px;
  margin: 20px;
}

.placeholder-content {
  text-align: center;
  color: rgba(255, 255, 255, 0.6);
  padding: 40px;
}

.placeholder-content i {
  font-size: 48px;
  color: rgba(0, 122, 255, 0.4);
  margin-bottom: 20px;
  display: block;
}

.placeholder-content h3 {
  color: rgba(255, 255, 255, 0.8);
  font-size: 24px;
  margin: 0 0 15px 0;
  font-weight: bold;
}

.placeholder-content p {
  color: rgba(255, 255, 255, 0.6);
  font-size: 16px;
  line-height: 1.5;
  margin: 0;
}

/* 锤锤解题模式的模式按钮高亮样式 */
.mode-button .mode-credits.highlight {
  background: linear-gradient(135deg, #ff6b35, #f7931e);
  color: white;
  font-weight: bold;
  box-shadow: 0 2px 8px rgba(255, 107, 53, 0.3);
  animation: pulse-highlight 2s ease-in-out infinite;
}

@keyframes pulse-highlight {
  0%,
  100% {
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.3);
  }
  50% {
    box-shadow: 0 4px 15px rgba(255, 107, 53, 0.5);
    /* 移除 transform: scale(1.05) 以避免影响布局 */
  }
}

/* 解题模式响应式适配 */
@media (max-width: 768px) {
  .video-generate-btn {
    padding: 10px 20px;
    font-size: 14px;
  }

  .video-player-header {
    padding: 12px 15px;
  }

  .video-player-header h3 {
    font-size: 16px;
  }

  .placeholder-content {
    padding: 30px 20px;
  }

  .placeholder-content i {
    font-size: 36px;
  }

  .placeholder-content h3 {
    font-size: 20px;
  }

  .placeholder-content p {
    font-size: 14px;
  }
}

/* 解题模式特定的容器布局 */
.container.solve-mode {
  grid-template-columns: 1fr;
  grid-template-rows: auto auto 1fr;
  gap: 20px;
}

.container.solve-mode .response-area {
  order: 1;
}

.container.solve-mode .video-preview {
  order: 2;
}

/* 解题阶段指示器 */
.solve-phase-indicator {
  position: absolute;
  top: 15px;
  right: 15px;
  background: rgba(0, 122, 255, 0.9);
  color: white;
  padding: 5px 12px;
  border-radius: 15px;
  font-size: 12px;
  font-weight: bold;
  z-index: 10;
}

.solve-phase-indicator.solving {
  background: linear-gradient(135deg, #ff6b35, #f7931e);
  animation: pulse 2s ease-in-out infinite;
}

.solve-phase-indicator.solved {
  background: linear-gradient(135deg, #34c759, #32d74b);
}

.solve-phase-indicator.generating_video {
  background: linear-gradient(135deg, #007aff, #40e0d0);
  animation: pulse 2s ease-in-out infinite;
}

.solve-phase-indicator.video_ready {
  background: linear-gradient(135deg, #af52de, #bf5af2);
}

@keyframes pulse {
  0%,
  100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.8;
    transform: scale(1.05);
  }
}

/* 重新生成按钮样式 */
.regenerate-btn {
  background-color: #ff9800;
  color: white;
  border: none;
  border-radius: 6px;
  padding: 8px 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 14px;
  transition: all 0.2s ease;
  margin-right: 10px;
}

.regenerate-btn:hover {
  background-color: #e68900;
  transform: translateY(-1px);
}

.regenerate-btn i {
  font-size: 16px;
}

/* 重新渲染当前代码按钮样式 */
.rerender-current-btn {
  background-color: #2196f3;
  color: white;
  border: none;
  border-radius: 6px;
  padding: 8px 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 14px;
  transition: all 0.2s ease;
  margin-top: 10px;
}

.rerender-current-btn:hover {
  background-color: #1976d2;
  transform: translateY(-1px);
}

.rerender-current-btn:disabled {
  background-color: #ccc;
  cursor: not-allowed;
  transform: none;
}

.rerender-current-btn i {
  font-size: 16px;
}

/* 布局容器样式 */
.layout-container {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  width: 100%;
  position: relative;
  justify-content: flex-start;
}

/* 顶部统一整条导航栏 */
.global-top-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 76px;
  background: rgba(10, 15, 30, 0.9); /* 更半透明科技感黑底 */
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  z-index: 9999;
  border-bottom: 1px solid rgba(0, 170, 255, 0.15);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.4);
  pointer-events: auto; /* 保证底色本身可以阻止穿透 */
  
  /* 初始为收起状态 */
  transform: translateY(-68px);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), background 0.3s ease;
}

.mobile-top-bar-title {
  display: none;
}

/* 展开状态 */
.global-top-bar.expanded {
  transform: translateY(0);
  background: rgba(10, 15, 30, 0.95);
  border-bottom-color: rgba(0, 170, 255, 0.25);
}

/* 顶部下拉提示指示器 */
.top-bar-indicator {
  position: absolute;
  bottom: -26px;
  left: 50%;
  transform: translateX(-50%);
  width: 86px;
  height: 26px;
  padding: 0;
  background: rgba(15, 22, 45, 0.95);
  border: 1px solid rgba(0, 170, 255, 0.35);
  border-top: none;
  border-radius: 0 0 14px 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(0, 170, 255, 0.9);
  font-size: 18px;
  cursor: pointer;
  z-index: 10002;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(0, 170, 255, 0.06);
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  pointer-events: auto;
}

/* 🎯 隐形扩点击区域：用伪元素将点击触发面积扩大2.5倍，解决由于太细导致难以点中的问题 */
.top-bar-indicator::before {
  content: '';
  position: absolute;
  top: -15px;
  left: -25px;
  right: -25px;
  bottom: -15px;
  background: transparent;
  pointer-events: auto;
}

.top-bar-indicator:hover {
  background: rgba(20, 30, 60, 0.98);
  border-color: rgba(0, 170, 255, 0.6);
  color: #fff;
  height: 29px; /* 悬停时稍微拉伸，极富弹性暗示 */
  bottom: -29px;
  box-shadow: 0 7px 20px rgba(0, 0, 0, 0.36), 0 0 15px rgba(0, 170, 255, 0.42);
}

.top-bar-indicator i {
  display: flex;
  align-items: center;
  justify-content: center;
  animation: topBarIndicatorBounce 2.2s infinite ease-in-out;
  transition: transform 0.3s ease;
}

/* 呼吸灯和微动动画 */
@keyframes topBarIndicatorBounce {
  0%, 100% {
    transform: translateY(0);
    opacity: 0.6;
  }
  50% {
    transform: translateY(2px);
    opacity: 1;
    text-shadow: 0 0 6px rgba(0, 170, 255, 0.9);
  }
}

/* 当导航栏展开时指示器的变化 */
.global-top-bar.expanded .top-bar-indicator {
  bottom: 0;
  height: 0;
  opacity: 0;
  pointer-events: none;
  border-color: transparent;
}

/* 顶部统分割线 */
.top-bar-separator {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, rgba(0,170,255,0) 0%, rgba(0,170,255,0.3) 50%, rgba(0,170,255,0) 100%);
  z-index: 10001;
  pointer-events: none;
}

.layout-content {
  flex: 1 0 auto;
  width: 100%;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
}

/* 白板页面专用全屏容器样式 */
.layout-container--board {
  height: 100vh !important;
  min-height: 100vh !important;
  overflow: hidden !important;
  justify-content: flex-start !important; /* 避免垂直居中导致子元素压缩 */
}

.layout-container--board .layout-content {
  height: 100vh !important;
  max-height: 100vh !important;
  overflow: hidden !important;
  flex: 1 !important;
}

/* ============================================================
   Light workspace polish — aligned with the landing cover
   ============================================================ */
html[data-theme='light'] .layout-container:not(.layout-container--board) {
  background:
    radial-gradient(circle at 88% 4%, rgba(66, 133, 244, 0.12), transparent 31rem),
    radial-gradient(circle at 8% 86%, rgba(52, 168, 83, 0.07), transparent 27rem),
    #fff;
}

html[data-theme='light'] .layout-container:not(.layout-container--board)::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(26, 115, 232, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(26, 115, 232, 0.025) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, #000, transparent 70%);
}

html[data-theme='light'] .global-top-bar,
html[data-theme='light'] .global-top-bar.expanded {
  background: rgba(255, 255, 255, 0.9) !important;
  border-bottom: 1px solid rgba(225, 231, 239, 0.92) !important;
  box-shadow: 0 8px 28px rgba(37, 55, 84, 0.08) !important;
  backdrop-filter: blur(18px) saturate(150%);
}

html[data-theme='light'] .top-bar-indicator {
  color: var(--hm-blue) !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: #d7e1ee !important;
  box-shadow: 0 5px 14px rgba(37, 55, 84, 0.09) !important;
}

html[data-theme='light'] .top-bar-separator {
  background: linear-gradient(90deg, transparent, rgba(26, 115, 232, 0.2), transparent) !important;
}

html[data-theme='light'] .math-animation { opacity: 0.08 !important; filter: saturate(0.8); }
html[data-theme='light'] .home-content-wrapper .logo { color: var(--hm-ink) !important; text-shadow: none !important; }
html[data-theme='light'] .home-content-wrapper .clickable-username { color: var(--hm-blue) !important; }
html[data-theme='light'] .home-content-wrapper .logo-glow,
html[data-theme='light'] .home-content-wrapper .logo-pulse,
html[data-theme='light'] .home-content-wrapper .logo-circuit { opacity: 0.12 !important; }

html[data-theme='light'] .manim-unified-panel,
html[data-theme='light'] .threejs-unified-panel,
html[data-theme='light'] .solve-unified-panel,
html[data-theme='light'] .qq-unified-panel,
html[data-theme='light'] .geogebra-unified-panel {
  --input-bg: #f6f8fb;
  --input-border: #dce3ec;
  --input-focus-bg: #fff;
  --input-btn-color: #69717c;
  --input-placeholder-color: #8a919a;
  --petal-bg: #fff;
  --petal-border: #d8e0e9;
  --petal-color: #3c4043;
  --petal-shadow: var(--hm-shadow-sm);
  --petal-active-bg: #e8f0fe;
  --petal-active-border: #8ab4f8;
  --petal-active-color: #1967d2;
  --petal-active-shadow: 0 8px 22px rgba(26, 115, 232, 0.14);
}

html[data-theme='light'] .input-capsule-bar {
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid #dce3ec !important;
  box-shadow: 0 14px 36px rgba(37, 55, 84, 0.1) !important;
}

html[data-theme='light'] .input-capsule-bar:focus-within {
  border-color: rgba(26, 115, 232, 0.56) !important;
  box-shadow: 0 0 0 4px rgba(26, 115, 232, 0.09), 0 16px 38px rgba(37, 55, 84, 0.11) !important;
}

html[data-theme='light'] .tech-card,
html[data-theme='light'] .response-area,
html[data-theme='light'] .animation-preview,
html[data-theme='light'] .solve-left-panel.tech-card,
html[data-theme='light'] .solve-right-panel.open,
html[data-theme='light'] .geogebra-preview {
  color: var(--hm-ink) !important;
  background: var(--hm-panel) !important;
  border: 1px solid var(--hm-line) !important;
  border-radius: var(--hm-radius) !important;
  box-shadow: var(--hm-shadow-md) !important;
}

/* 锤锤解题模式输入态保持透明，移除残留白色卡片背景与边框 */
.solve-left-panel:not(.tech-card),
html[data-theme='light'] .solve-left-panel:not(.tech-card) {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* 解题模式结果面板的阅读白纸体验优化 */
html[data-theme='light'] .solve-left-panel.tech-card .response-content {
  background-color: #ffffff !important;
  color: var(--text-color, #1f1f1f) !important;
  border: 1px solid var(--hm-line, #e1e7ef) !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}

html[data-theme='light'] .tech-card::before,
html[data-theme='light'] .tech-card::after { display: none !important; }
html[data-theme='light'] .preview-header,
html[data-theme='light'] .geogebra-panel-tabs { border-color: var(--hm-line) !important; }
html[data-theme='light'] .preview-title,
html[data-theme='light'] .repository-link,
html[data-theme='light'] .video-repo-hint,
html[data-theme='light'] .geogebra-repo-hint { color: var(--hm-blue) !important; }

html[data-theme='light'] .viewer-actions button,
html[data-theme='light'] .action-button,
html[data-theme='light'] .refine-trigger-btn,
html[data-theme='light'] .refine-trigger-btn-inline {
  color: #47515e !important;
  background: #fff !important;
  border: 1px solid #dce3ec !important;
  border-radius: 11px !important;
  box-shadow: var(--hm-shadow-sm) !important;
}

html[data-theme='light'] .viewer-actions button:hover,
html[data-theme='light'] .action-button:hover,
html[data-theme='light'] .refine-trigger-btn:hover,
html[data-theme='light'] .refine-trigger-btn-inline:hover {
  color: var(--hm-blue) !important;
  border-color: #a9c6ef !important;
  transform: translateY(-1px);
}

html[data-theme='light'] .browser-tip-global { color: #8a919a !important; }
html[data-theme='light'] .page-loader { color: var(--hm-ink) !important; background: #fff !important; }
html[data-theme='light'] .page-loader-logo { color: var(--hm-blue) !important; text-shadow: none !important; }
html[data-theme='light'] .page-loader-spinner {
  border-color: #e2e8f0 !important;
  border-top-color: var(--hm-blue) !important;
  box-shadow: none !important;
}

/* ==========================================
   移动端优化：语音弹窗与加载过程等比缩小
   ========================================== */
@media (max-width: 768px) {
  /* 1. 语音弹窗移动端缩小优化 */
  .voiceover-modal-overlay {
    bottom: 135px !important; /* 精确漂浮于底部模式药丸及输入框上方，不遮挡 */
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: calc(100vw - 32px) !important;
    max-width: 320px !important;
    top: auto !important; /* 强制覆盖 pc 端计算的 top */
  }

  .voiceover-modal {
    padding: 0.5rem 0.6rem !important;
    gap: 0.4rem !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5) !important;
    width: 100% !important;
  }

  .voiceover-modal-title {
    font-size: 0.75rem !important;
  }

  .voiceover-voice-select {
    font-size: 0.7rem !important;
    max-width: 80px !important;
    padding: 0.15rem 0.3rem !important;
    border-radius: 4px !important;
  }

  .voiceover-btn-primary,
  .voiceover-btn-secondary {
    padding: 0.25rem 0 !important;
    font-size: 0.75rem !important;
    border-radius: 6px !important;
  }

  .voiceover-toast-close {
    font-size: 0.95rem !important;
  }

  /* 2. 加载过程（Loading Overlay）等比缩小优化与不透明度提升 */
  .loading-overlay {
    background-color: #0c101d !important; /* 提升为 100% 完全不透明，彻底移除后面隐约可见的 AI 响应流式文本 */
    backdrop-filter: none !important;
    padding: 12px !important; /* 加载框内边距缩小，极致紧凑 */
    border-radius: 12px !important;
  }

  .loading-overlay-content {
    width: 95% !important; /* 等比扩展并缩小边缘留白 */
  }

  .loading-brand {
    font-size: 1.5rem !important;
    margin-bottom: 12px !important;
    letter-spacing: 2px !important;
  }

  .loading-progress-bar-container {
    height: 4px !important;
    margin-bottom: 12px !important;
  }

  .loading-progress-info {
    font-size: 11px !important;
    margin-bottom: 8px !important;
  }

  .loading-text {
    font-size: 12.5px !important;
    line-height: 1.35 !important;
  }

  .loading-quote {
    font-size: 11px !important;
    padding: 8px 12px !important;
    margin: 10px auto 0 !important;
    max-width: 92% !important;
    line-height: 1.35 !important;
    border-radius: 10px !important;
  }

  .quote-icon-left,
  .quote-icon-right {
    font-size: 9px !important;
  }

  /* 3. 动画预览顶部控件移动端优化（去除文字，等比缩小，避免凌乱重叠） */
  .preview-header.centered-header {
    display: flex !important;
    flex-wrap: nowrap !important; /* 避免换行重叠 */
    justify-content: space-between !important;
    align-items: center !important;
    height: 52px !important; /* 减小高度，腾出视频空间 */
    padding: 6px 12px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: rgba(10, 10, 20, 0.6) !important;
    backdrop-filter: blur(10px) !important;
    gap: 8px !important;
    margin-bottom: 6px !important; /* 极小化标题栏与下方播放器的间距，解决按钮与视频分得太开的问题 */
  }

  /* 缩减整体预览卡片的 padding，使视频界面能紧凑地顶上来，更美观 */
  .animation-preview {
    padding: 10px !important;
    border-radius: 12px !important;
  }

  /* 视频播放器和内容区自适应高度优化，防止把下载栏挤下屏幕，并拉近间距 */
  .preview-content {
    min-height: auto !important; /* 强制移除移动端 500px 最小高度，自动拉近并包裹 16:9 视频 */
    height: auto !important;
    border-radius: 0 0 10px 10px !important;
  }

  .video-player {
    height: auto !important;
    min-height: auto !important;
  }

  .video-player video {
    width: 100% !important;
    height: auto !important; /* 自适应缩放 */
    max-height: 52vh !important; /* 保证视频画面不会拉得太高导致超出屏幕 */
    object-fit: contain !important;
  }

  /* 紧凑化视频下载栏，确保它在手机端始终完美显示，绝不被切断 */
  .video-download-bar {
    padding: 6px 0 !important;
    background: #0d0d0d !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    justify-content: center !important;
  }

  .video-download-btn {
    padding: 5px 15px !important;
    font-size: 11px !important;
    border-radius: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
  }

  /* 优化各种科技卡片的移动端内边距，使内容更紧凑 */
  .tech-card {
    padding: 12px !important;
    border-radius: 12px !important;
  }

  /* 隐藏居中多余的自动保存提示词与副标题，避免遮挡和凌乱 */
  .preview-header.centered-header .centered-content {
    position: static !important;
    transform: none !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1 !important;
    pointer-events: auto !important;
  }

  .preview-header.centered-header .preview-title {
    font-size: 0.85rem !important; /* 缩小标题 */
    font-weight: 600 !important;
    white-space: nowrap !important;
    gap: 4px !important;
  }

  .preview-header.centered-header .preview-title i {
    font-size: 1rem !important;
  }

  /* 完全隐藏移动端的温馨自动保存提示文本，以免严重挤压空间 */
  .preview-header.centered-header .preview-hint {
    display: none !important;
  }

  /* “返回” 与 “微调” 按钮等比缩小，移除文字 */
  .preview-header.centered-header .return-button,
  .preview-header.centered-header .refine-trigger-btn {
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    border-radius: 50% !important; /* 完美圆形 */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  /* 隐藏按钮内的文字，仅保留图标 */
  .preview-header.centered-header .return-button .btn-text,
  .preview-header.centered-header .refine-trigger-btn .btn-text {
    display: none !important;
  }

  /* 微调按钮与返回按钮图标等比缩放居中 */
  .preview-header.centered-header .return-button i,
  .preview-header.centered-header .refine-trigger-btn i {
    font-size: 15px !important;
    margin: 0 !important;
    line-height: 1 !important;
  }

  /* 针对没有 centered-header 的其他预览页 header 也进行同步缩微适配 */
  .preview-header:not(.centered-header) {
    margin-bottom: 10px !important;
    padding: 4px 8px !important;
  }
  
  .preview-header:not(.centered-header) .return-button {
    height: 30px !important;
    padding: 4px 10px !important;
    font-size: 12px !important;
    border-radius: 15px !important;
  }
}

/* ========================================================
   LIGHT THEME ADAPTIVE STYLES (Gemini-inspired Light Mode)
   ======================================================== */
html[data-theme='light'] {
  color-scheme: light;
}

html[data-theme='light'] body {
  background: var(--background-gradient) !important;
  color: var(--text-color) !important;
  position: relative;
}

/* 类似 Gemini 的彩色光晕动效 */
html[data-theme='light'] body::before,
html[data-theme='light'] body::after,
html[data-theme='light'] .layout-container::before {
  content: '';
  position: fixed;
  border-radius: 50%;
  pointer-events: none;
  z-index: -1;
  filter: blur(120px);
  opacity: 0.35;
  mix-blend-mode: multiply; /* 亮色背景下混合更自然 */
}

/* 蓝色/青色光晕 - 左上 */
html[data-theme='light'] body::before {
  top: -20vh;
  left: -20vw;
  width: 65vw;
  height: 65vw;
  background: radial-gradient(circle, rgba(66, 133, 244, 0.4) 0%, rgba(0, 242, 254, 0.1) 50%, transparent 70%);
  animation: geminiGlowFloat1 25s infinite alternate ease-in-out;
}

/* 紫色/粉色光晕 - 右下 */
html[data-theme='light'] body::after {
  bottom: -20vh;
  right: -20vw;
  width: 70vw;
  height: 70vw;
  background: radial-gradient(circle, rgba(155, 114, 203, 0.4) 0%, rgba(217, 101, 112, 0.15) 40%, transparent 70%);
  animation: geminiGlowFloat2 30s infinite alternate ease-in-out;
}

/* 黄色/橙色光晕 - 中间偏右 */
html[data-theme='light'] .layout-container::before {
  top: 30vh;
  right: -10vw;
  width: 50vw;
  height: 50vw;
  background: radial-gradient(circle, rgba(251, 188, 5, 0.25) 0%, rgba(241, 154, 62, 0.08) 50%, transparent 70%);
  animation: geminiGlowFloat3 22s infinite alternate ease-in-out;
}

@keyframes geminiGlowFloat1 {
  0% {
    transform: translate(0, 0) scale(1) rotate(0deg);
  }
  50% {
    transform: translate(8vw, 12vh) scale(1.15) rotate(120deg);
  }
  100% {
    transform: translate(-4vw, 5vh) scale(0.9) rotate(240deg);
  }
}

@keyframes geminiGlowFloat2 {
  0% {
    transform: translate(0, 0) scale(1) rotate(0deg);
  }
  50% {
    transform: translate(-10vw, -8vh) scale(0.85) rotate(-120deg);
  }
  100% {
    transform: translate(4vw, -4vh) scale(1.1) rotate(-240deg);
  }
}

@keyframes geminiGlowFloat3 {
  0% {
    transform: translate(0, 0) scale(1);
  }
  50% {
    transform: translate(-6vw, 10vh) scale(1.2);
  }
  100% {
    transform: translate(6vw, -5vh) scale(0.95);
  }
}

/* 浮动数学动画淡化 */
html[data-theme='light'] .math-animation {
  opacity: 0.75 !important;
}

html[data-theme='light'] .math-symbol {
  opacity: 0.85; /* 移除 !important，以便 JS 的 hover 效果（opacity: 1）能够正常生效 */
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}

/* 顶部导航栏亮色适配 */
html[data-theme='light'] .global-top-bar {
  background: var(--glass-background) !important;
  border-bottom: 1px solid var(--border-color) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
}

html[data-theme='light'] .top-bar-separator {
  background: var(--border-color) !important;
}

html[data-theme='light'] .top-bar-indicator {
  background: var(--glass-background) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-secondary) !important;
}

/* 首页标题与吉祥物亮色适配 - 炫丽的 Gemini 彩色渐变字效 */
html[data-theme='light'] .logo {
  background: linear-gradient(90deg, #4285f4 0%, #9b72cb 35%, #d96570 70%, #f19a3e 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  text-shadow: none !important;
  display: inline-block;
}

/* 确保子元素也继承渐变彩色 */
html[data-theme='light'] .logo * {
  background: linear-gradient(90deg, #4285f4 0%, #9b72cb 35%, #d96570 70%, #f19a3e 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

html[data-theme='light'] .logo-mascot {
  filter: drop-shadow(0 4px 10px rgba(26, 115, 232, 0.15)) !important;
}

html[data-theme='light'] .tech-header .tagline {
  color: var(--text-secondary) !important;
  text-shadow: none !important;
}

html[data-theme='light'] .header-decoration {
  opacity: 0.2;
}

/* 模式选择器亮色适配 */
html[data-theme='light'] .current-mode-card {
  background: var(--card-background) !important;
  border: 1px solid var(--border-color) !important;
  box-shadow: 
    0 10px 30px rgba(0, 0, 0, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

html[data-theme='light'] .current-mode-card:hover {
  border-color: var(--accent-color) !important;
  box-shadow: 
    0 15px 40px rgba(0, 0, 0, 0.08),
    0 0 20px var(--accent-glow) !important;
}

html[data-theme='light'] .mode-card-background {
  opacity: 0.04 !important;
}

html[data-theme='light'] .mode-icon-large {
  background: linear-gradient(135deg, rgba(26, 115, 232, 0.08), rgba(26, 115, 232, 0.15)) !important;
  border: 1px solid rgba(26, 115, 232, 0.3) !important;
  box-shadow: 0 4px 12px rgba(26, 115, 232, 0.1) !important;
}

html[data-theme='light'] .mode-icon-large i {
  color: var(--accent-color) !important;
  filter: none !important;
}

html[data-theme='light'] .mode-title {
  color: var(--text-color) !important;
}

html[data-theme='light'] .mode-desc {
  color: var(--text-secondary) !important;
}

html[data-theme='light'] .mode-badge {
  background: rgba(26, 115, 232, 0.1) !important;
  color: var(--accent-color) !important;
}

/* 模式网格项亮色适配 */
html[data-theme='light'] .mode-grid-item {
  background: var(--secondary-color) !important;
  border: 1px solid var(--border-color) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02) !important;
}

html[data-theme='light'] .mode-grid-item::before {
  background: linear-gradient(135deg, rgba(26, 115, 232, 0.03), rgba(26, 115, 232, 0.06)) !important;
}

html[data-theme='light'] .mode-grid-item:hover {
  border-color: var(--accent-color) !important;
  box-shadow: 
    0 6px 18px rgba(0, 0, 0, 0.05),
    0 0 15px var(--accent-glow) !important;
}

html[data-theme='light'] .mode-grid-item.active {
  background: #e8f0fe !important;
  border-color: var(--accent-color) !important;
  box-shadow: 
    0 6px 18px rgba(26, 115, 232, 0.12),
    0 0 15px var(--accent-glow) !important;
}

html[data-theme='light'] .mode-grid-icon {
  background: rgba(26, 115, 232, 0.1) !important;
  color: var(--accent-color) !important;
}

html[data-theme='light'] .mode-grid-icon i {
  color: var(--accent-color) !important;
}

html[data-theme='light'] .mode-grid-title {
  color: var(--text-color) !important;
}

html[data-theme='light'] .mode-grid-desc {
  color: var(--text-secondary) !important;
}

html[data-theme='light'] .mode-grid-credits {
  background: rgba(0, 0, 0, 0.04) !important;
  color: var(--text-secondary) !important;
}

html[data-theme='light'] .mode-grid-credits.active {
  background: rgba(26, 115, 232, 0.1) !important;
  color: var(--accent-color) !important;
}

/* 选项面板及下拉选择亮色适配 */
html[data-theme='light'] .config-section-title,
html[data-theme='light'] .config-option-label {
  color: var(--text-color) !important;
}

html[data-theme='light'] .select-custom-trigger {
  background: var(--primary-color) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-color) !important;
}

html[data-theme='light'] .select-custom-trigger:hover {
  border-color: var(--accent-color) !important;
}

html[data-theme='light'] .select-custom-dropdown {
  background: var(--primary-color) !important;
  border: 1px solid var(--border-color) !important;
  box-shadow: var(--glass-shadow-strong) !important;
}

html[data-theme='light'] .select-custom-option {
  color: var(--text-color) !important;
}

html[data-theme='light'] .select-custom-option:hover {
  background: var(--hover-color) !important;
}

html[data-theme='light'] .select-custom-option.selected {
  background: var(--accent-glow) !important;
  color: var(--accent-color) !important;
}

/* 输入框区域与胶囊亮色适配 */
html[data-theme='light'] .input-capsule-bar {
  box-shadow: 
    0 8px 30px rgba(0, 0, 0, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

html[data-theme='light'] .input-capsule-textarea {
  color: var(--text-color) !important;
}

html[data-theme='light'] .ai-enhance-icon-btn {
  color: #6366f1 !important;
}

html[data-theme='light'] .ai-enhance-icon-btn:hover {
  color: #4f46e5 !important;
  text-shadow: 0 0 8px rgba(79, 70, 229, 0.3) !important;
}

/* AI修饰面板亮色适配 */
html[data-theme='light'] .petal-menu-container {
  background: var(--primary-color) !important;
  border: 1px solid var(--border-color) !important;
  box-shadow: var(--glass-shadow-strong) !important;
}

html[data-theme='light'] .petal-item {
  color: var(--text-color) !important;
}

html[data-theme='light'] .petal-item:hover {
  background: var(--hover-color) !important;
  color: var(--accent-color) !important;
}

/* 回复区域亮色适配 */
html[data-theme='light'] .response-content {
  background-color: var(--secondary-color) !important;
  color: var(--text-color) !important;
  border: 1px solid var(--border-color) !important;
}

html[data-theme='light'] .preview-header.sticky {
  background-color: var(--primary-color) !important;
  border-bottom: 1px solid var(--border-color) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02) !important;
}

html[data-theme='light'] .new-query-btn,
html[data-theme='light'] .copy-btn {
  background-color: var(--secondary-color) !important;
  color: var(--text-secondary) !important;
  border: 1px solid var(--border-color) !important;
}

html[data-theme='light'] .new-query-btn:hover,
html[data-theme='light'] .copy-btn:hover {
  background-color: var(--accent-color) !important;
  color: #ffffff !important;
  border-color: var(--accent-color) !important;
}

html[data-theme='light'] .success-message {
  background-color: rgba(24, 128, 56, 0.08) !important;
  border-left: 4px solid var(--success-color) !important;
  color: var(--success-color) !important;
}

html[data-theme='light'] .error-container {
  background-color: rgba(217, 48, 37, 0.08) !important;
  border-left: 4px solid var(--error-color) !important;
}

html[data-theme='light'] .error-message {
  color: var(--error-color) !important;
}

/* 微调及对比面板亮色适配 */
html[data-theme='light'] .refine-trigger-btn {
  background: linear-gradient(135deg, #f3e8ff 0%, #e9d5ff 100%) !important;
  border: 1px solid #c084fc !important;
  color: #6b21a8 !important;
}

html[data-theme='light'] .refine-trigger-btn i {
  color: #7e22ce !important;
}

html[data-theme='light'] .refine-trigger-btn:hover {
  background: linear-gradient(135deg, #e9d5ff 0%, #d8b4fe 100%) !important;
  border-color: #a855f7 !important;
  color: #581c87 !important;
  box-shadow: 0 4px 14px rgba(168, 85, 247, 0.15) !important;
}

html[data-theme='light'] .refine-trigger-btn-corner {
  background: linear-gradient(135deg, #f3e8ff 0%, #e9d5ff 100%) !important;
  border: 1px solid #c084fc !important;
  color: #6b21a8 !important;
  box-shadow: 0 4px 12px rgba(168, 85, 247, 0.1) !important;
}

html[data-theme='light'] .refine-drawer-container {
  background: var(--primary-color) !important;
  border-left: 1px solid var(--border-color) !important;
  box-shadow: -4px 0 30px rgba(0, 0, 0, 0.05) !important;
}

html[data-theme='light'] .refine-drawer-header {
  border-bottom: 1px solid var(--border-color) !important;
}

html[data-theme='light'] .refine-drawer-title {
  color: var(--text-color) !important;
}

html[data-theme='light'] .refine-history-card {
  background: var(--secondary-color) !important;
  border: 1px solid var(--border-color) !important;
}

html[data-theme='light'] .refine-history-card:hover {
  border-color: var(--accent-color) !important;
}

html[data-theme='light'] .refine-history-text {
  color: var(--text-color) !important;
}

/* 名言推荐栏亮色适配 */
html[data-theme='light'] .loading-quote {
  background: rgba(0, 0, 0, 0.02) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-secondary) !important;
}

html[data-theme='light'] .quote-icon-left,
html[data-theme='light'] .quote-icon-right {
  color: rgba(0, 0, 0, 0.2) !important;
}

/* 按钮微调及阴影 */
html[data-theme='light'] .action-btn {
  background: var(--primary-color) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-color) !important;
}

html[data-theme='light'] .action-btn:hover {
  border-color: var(--accent-color) !important;
  color: var(--accent-color) !important;
  background: var(--hover-color) !important;
}

/* 弹窗/模态框亮色适配 */
html[data-theme='light'] .modal-overlay {
  background-color: rgba(0, 0, 0, 0.4) !important;
}

html[data-theme='light'] .modal-container,
html[data-theme='light'] .recharge-modal-content,
html[data-theme='light'] .checkin-modal-content,
html[data-theme='light'] .announcement-modal-content {
  background: var(--primary-color) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-color) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1) !important;
}

html[data-theme='light'] .modal-title,
html[data-theme='light'] .modal-header h3 {
  color: var(--text-color) !important;
}

html[data-theme='light'] .modal-close,
html[data-theme='light'] .close-button {
  color: var(--text-secondary) !important;
}

html[data-theme='light'] .modal-close:hover,
html[data-theme='light'] .close-button:hover {
  color: var(--text-color) !important;
  background-color: var(--hover-color) !important;
}

/* 页脚自适应适配 */
html[data-theme='light'] .browser-tip-global span {
  color: var(--text-secondary) !important;
}

html[data-theme='light'] .browser-tip-global i {
  color: var(--text-secondary) !important;
}

/* 真正的全局页脚亮色主题适配 */
html[data-theme='light'] .global-footer {
  color: var(--text-secondary) !important;
}

html[data-theme='light'] .footer-item {
  background: rgba(26, 115, 232, 0.05);
  border: 1px solid rgba(26, 115, 232, 0.1);
  padding: 6px 14px;
  border-radius: 20px;
  color: #4a5568 !important;
  font-weight: 500;
  transition: all 0.3s ease;
}

html[data-theme='light'] .footer-item i {
  color: var(--accent-color) !important;
}

html[data-theme='light'] .footer-item:hover {
  background: rgba(26, 115, 232, 0.1);
  border-color: rgba(26, 115, 232, 0.3);
  color: var(--accent-color) !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(26, 115, 232, 0.12);
}

/* 亮色模式下二维码弹窗适配 */
html[data-theme='light'] .hover-item .qr-popup {
  background: #ffffff;
  border: 1px solid var(--border-color);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

html[data-theme='light'] .hover-item .qr-popup::after {
  border-color: #ffffff transparent transparent transparent;
}

/* 亮色模式下生成过程动画（LoadingOverlay）完美适配 - 采用柔和的 Gemini 渐变彩色与微发光 */
html[data-theme='light'] .loading-overlay {
  background-color: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(26, 115, 232, 0.08) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.03) !important;
}

html[data-theme='light'] .loading-overlay::-webkit-scrollbar-thumb {
  background: rgba(60, 64, 67, 0.15) !important;
}

html[data-theme='light'] .loading-brand {
  background: linear-gradient(90deg, #4285f4 0%, #9b72cb 35%, #d96570 70%, #f19a3e 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  text-shadow: none !important;
  animation: none !important; /* 移除闪烁动画，保持高端稳重 */
}

html[data-theme='light'] .loading-progress-bar-container {
  background-color: rgba(0, 0, 0, 0.05) !important;
  border: 1px solid rgba(0, 0, 0, 0.02) !important;
}

html[data-theme='light'] .loading-progress-bar {
  background: linear-gradient(90deg, #4285f4 0%, #9b72cb 50%, #d96570 100%) !important;
  box-shadow: 0 0 10px rgba(155, 114, 203, 0.3) !important;
}

html[data-theme='light'] .loading-progress-info {
  color: #4a5568 !important;
  text-shadow: none !important;
}

html[data-theme='light'] .loading-text {
  color: #1f1f1f !important;
  text-shadow: none !important;
}

html[data-theme='light'] .loading-quote {
  background: rgba(255, 255, 255, 0.9) !important;
  border: 1px solid rgba(26, 115, 232, 0.1) !important;
  color: #4a5568 !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
  text-shadow: none !important;
}

html[data-theme='light'] .loading-quote .quote-icon-left,
html[data-theme='light'] .loading-quote .quote-icon-right {
  color: rgba(26, 115, 232, 0.3) !important;
}

/* 亮色模式下动画预览面板头部（preview-header）与按钮适配 */
html[data-theme='light'] .preview-header {
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
}

html[data-theme='light'] .preview-title {
  color: #1f1f1f !important;
}

html[data-theme='light'] .preview-title i {
  color: var(--accent-color) !important;
}

html[data-theme='light'] .preview-hint {
  color: #5f6368 !important;
}

html[data-theme='light'] .preview-hint .repository-link {
  background-color: rgba(26, 115, 232, 0.08) !important;
  color: var(--accent-color) !important;
}

html[data-theme='light'] .preview-hint .repository-link:hover {
  background-color: rgba(26, 115, 232, 0.15) !important;
}

/* 返回按钮亮色适配 - 温润的亮色微光胶囊 */
html[data-theme='light'] .return-button {
  background-color: rgba(0, 0, 0, 0.05) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  color: #4a5568 !important;
  box-shadow: none !important;
}

html[data-theme='light'] .return-button:hover {
  background-color: rgba(0, 0, 0, 0.1) !important;
  color: #1a202c !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
}

/* 微调按钮亮色适配 - 炫丽的 Gemini 彩色渐变胶囊 */
html[data-theme='light'] .refine-trigger-btn {
  background: linear-gradient(135deg, #4285f4 0%, #9b72cb 50%, #d96570 100%) !important;
  border: none !important;
  color: white !important;
  box-shadow: 0 4px 15px rgba(155, 114, 203, 0.25) !important;
}

html[data-theme='light'] .refine-trigger-btn i {
  color: white !important;
}

html[data-theme='light'] .refine-trigger-btn:hover {
  background: linear-gradient(135deg, #5191f5 0%, #a87fd6 50%, #e07489 100%) !important;
  box-shadow: 0 6px 20px rgba(155, 114, 203, 0.4) !important;
  transform: translateY(-2px);
}

/* 亮色模式下视频下载栏与下载按钮适配 */
html[data-theme='light'] .video-download-bar {
  background: #f8fafd !important;
  border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
}

html[data-theme='light'] .video-download-btn {
  background: rgba(26, 115, 232, 0.06) !important;
  border: 1px solid rgba(26, 115, 232, 0.15) !important;
  color: #4a5568 !important;
}

html[data-theme='light'] .video-download-btn:hover {
  background: rgba(26, 115, 232, 0.12) !important;
  border-color: rgba(26, 115, 232, 0.3) !important;
  color: var(--accent-color) !important;
}



html[data-theme='light'] .global-footer-container {
  border-top: 1px solid var(--border-color) !important;
  background: var(--secondary-color) !important;
}

html[data-theme='light'] .global-footer-text,
html[data-theme='light'] .global-footer-link {
  color: var(--text-secondary) !important;
}

html[data-theme='light'] .global-footer-link:hover {
  color: var(--accent-color) !important;
}

/* 白板页面亮色主题适配 */
html[data-theme='light'] .board-page {
  background: #f8fafd !important;
}

html[data-theme='light'] .board-toolbar {
  background: var(--glass-background) !important;
  border-bottom: 1px solid var(--border-color) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
}

html[data-theme='light'] .board-back-btn {
  background: var(--secondary-color) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-color) !important;
}

html[data-theme='light'] .board-back-btn:hover {
  background: var(--hover-color) !important;
  border-color: var(--accent-color) !important;
  color: var(--accent-color) !important;
}

html[data-theme='light'] .board-title {
  color: var(--text-color) !important;
}

html[data-theme='light'] .board-subtitle {
  background: rgba(26, 115, 232, 0.08) !important;
  border: 1px solid rgba(26, 115, 232, 0.2) !important;
  color: var(--accent-color) !important;
}

html[data-theme='light'] .board-save-status {
  color: var(--text-secondary) !important;
}

html[data-theme='light'] .board-save-status.saved i {
  color: var(--success-color) !important;
}

/* 代码高亮样式 */
.response-content pre {
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  padding: 1rem;
  overflow-x: auto;
  margin: 1rem 0;
  position: relative;
  border-left: 3px solid var(--accent-color);
}

.response-content code {
  font-family: 'Fira Code', 'Roboto Mono', monospace;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--text-color);
  white-space: pre;
  display: block;
}

/* Manim语法关键字高亮 */
.manim-keyword {
  color: #569cd6; /* 蓝色 */
  font-weight: bold;
}

.manim-class {
  color: #4ec9b0; /* 青色 */
}

.manim-function {
  color: #dcdcaa; /* 黄色 */
}

.manim-method {
  color: #9cdcfe; /* 浅蓝色 */
}

.manim-string {
  color: #ce9178; /* 橙色 */
}

.manim-comment {
  color: #6a9955; /* 绿色 */
  font-style: italic;
}

.manim-number {
  color: #b5cea8; /* 浅绿色 */
}

/* 行号容器 */
.code-with-line-numbers {
  counter-reset: line;
  padding-left: 3.5rem;
  position: relative;
}

/* 行号样式 */
.code-line {
  position: relative;
  padding-left: 0.5rem;
  min-height: 1.5rem;
  line-height: 1.5rem;
  margin: 0;
  white-space: pre;
  counter-increment: line;
}

.code-line::before {
  content: counter(line);
  position: absolute;
  left: -3rem;
  width: 2.5rem;
  text-align: right;
  color: rgba(255, 255, 255, 0.4);
  font-size: 0.85rem;
}

/* 高亮当前行 */
.code-line.highlight {
  background-color: rgba(255, 255, 255, 0.1);
  border-left: 2px solid var(--accent-color);
}

/* 代码容器悬停时的样式变化 */
.response-content pre:hover .code-line::before {
  color: rgba(255, 255, 255, 0.6);
}

/* 代码语言标签 */
.code-language {
  position: absolute;
  top: 0;
  right: 0;
  background-color: var(--accent-color);
  color: white;
  padding: 0.25rem 0.75rem;
  border-radius: 0 6px 0 6px;
  font-size: 0.8rem;
  font-weight: bold;
  z-index: 1;
}

/* 复制按钮 */
.copy-code-btn {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  background: transparent;
  border: none;
  color: var(--text-secondary);
  cursor: pointer;
  font-size: 1rem;
  padding: 0.25rem;
  opacity: 0.5;
  transition: opacity 0.2s;
  z-index: 2;
}

.copy-code-btn:hover {
  opacity: 1;
  color: white;
} 

/* 解题模式 Markdown + KaTeX 排版 */
.solve-stream {
  font-size: 16px;
  line-height: 1.8;
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
  padding: 1rem 2rem;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--text-color, #1f1f1f);
  white-space: normal;
}
.solve-stream h1,
.solve-stream h2,
.solve-stream h3,
.solve-stream h4 {
  margin: 1rem 0 0.5rem;
  text-align: center;
  color: var(--hm-ink, #202124);
}
.solve-stream p { 
  margin: 0.6rem 0; 
  text-align: left;
  max-width: 100%;
  color: var(--text-color, #1f1f1f);
}
.solve-stream ul,
.solve-stream ol { 
  padding-left: 1.25rem; 
  text-align: left;
  max-width: 100%;
  color: var(--text-color, #1f1f1f);
}
.solve-stream blockquote {
  margin: 1rem 0;
  padding: 0.75rem 1rem;
  border-left: 4px solid var(--accent-color, #1a73e8);
  background: rgba(26, 115, 232, 0.05);
  border-radius: 6px;
  text-align: left;
  color: var(--text-color, #1f1f1f);
}
.solve-stream code { 
  display: inline; 
  white-space: pre-wrap; 
  padding: 0.15rem 0.35rem; 
  background: rgba(0, 0, 0, 0.05); 
  color: #b31412;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 4px; 
}
.solve-stream pre { 
  white-space: pre-wrap; 
  text-align: left;
  background: rgba(0, 0, 0, 0.03);
  padding: 0.75rem 1rem;
  border-radius: 6px;
}

/* KaTeX 公式块置中并留白 */
.solve-stream .katex-display { 
  margin: 1rem auto; 
  overflow-x: auto; 
  text-align: center;
  color: var(--text-color, #1f1f1f);
}
.solve-stream .katex { 
  font-size: 1.06em; 
  color: var(--text-color, #1f1f1f);
}
.solve-stream .katex-error {
  color: #d93025 !important;
  background: rgba(217, 48, 37, 0.08);
  border: 1px dashed rgba(217, 48, 37, 0.4);
  padding: 2px 6px;
  border-radius: 4px;
  font-family: inherit;
  font-size: 0.9em;
  word-break: break-all;
}

/* 数学公式错误样式 */
.math-error {
  color: #ff6b6b;
  background: rgba(255, 107, 107, 0.1);
  padding: 0.2rem 0.4rem;
  border-radius: 4px;
  border: 1px solid rgba(255, 107, 107, 0.3);
}

/* 提升层级，避免被其他浮层遮挡 */
.response-content { position: relative; }
.solve-stream { position: relative; z-index: 4; }

/* 解题模式下的 LoadingOverlay 样式调整 */
.loading-overlay.solve-mode {
  background-color: rgba(12, 16, 29, 0.85);
  backdrop-filter: blur(2px);
}

.loading-overlay.solve-mode .loading-brand {
  /* display: none !important; */
  color: #fff;
}

.loading-overlay.solve-mode .loading-overlay-content {
  gap: 1rem;
} 
/* 全局移动端优化样式 */

/* 基础响应式布局调整 */
@media (max-width: 768px) {
  :root {
    --content-width: 100%;
    --card-radius: 10px;
  }
  
  /* 移动端默认允许页面自然纵向滚动 */
  html, body {
    font-size: 15px;
  }

  /* 仅在指定路由锁定滚动（由 RouteScrollModeManager 控制 body 类名） */
  body.route-scroll-locked {
    overflow-x: hidden !important;
    overflow-y: hidden !important;
    height: 100% !important;
    position: fixed !important;
    width: 100% !important;
  }

  body.route-scroll-locked .app-container {
    display: flex !important;
    flex-direction: column !important;
    height: 100vh !important;
    height: 100dvh !important;
    overflow: hidden !important;
    position: relative !important;
  }

  body.route-scroll-locked .home-content-wrapper {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    height: 100% !important;
    padding-top: 56px !important; /* 向上移动主体，预留顶栏下拉高度即可 (原84px) */
    padding-bottom: 120px !important; /* 增加底部 padding，防止输入框上移时和画板产生遮挡 (原110px) */
    box-sizing: border-box !important;
  }
  
  body.route-scroll-locked .container {
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }
  
  /* 强制模式选择器也使用单列布局 */
  .mode-selector {
    grid-column: 1 / -1 !important;
    min-width: unset !important;
    max-width: 100% !important;
  }
  
  /* 强制所有模式下的容器都使用单列/自适应视口高度布局 */
  body.route-scroll-locked .container,
  body.route-scroll-locked .container.threejs-mode,
  body.route-scroll-locked .container.solve-mode {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }
  
  .card {
    padding: 1.2rem;
  }
  
  /* 优化头部布局 - 压缩高度以给操作画板留出最大空间 */
  header, .tech-header {
    padding: 2px 12px !important; /* 深度缩小 Padding (原8px) */
    margin-bottom: 0 !important;
    flex: 0 0 auto !important;
  }
  
  .title-container {
    padding: 0 !important;
    margin-top: -6px !important; /* 再往上微调 */
  }
  
  .logo {
    font-size: 1.15rem !important; /* 标题字号等比再缩小 (原1.4rem) */
    letter-spacing: 0.5px !important;
  }
  
  .logo-badge {
    right: -25px;
    font-size: 0.8rem;
    padding: 0.1rem 0.4rem;
  }
  
  .tagline {
    font-size: 0.68rem !important; /* 副标题字号等比再缩小 (原0.8rem) */
    margin-top: -2px !important; /* 缩短与大标题的距离 */
    margin-bottom: 0 !important;
    opacity: 0.75 !important;
  }
  
  .tagline-en {
    display: none !important; /* 移动端隐藏英文小标题，节省高度 */
  }
  
  /* 优化页脚 */
  .tech-footer {
    padding: 2rem 1.5rem;
    margin-top: 2rem;
  }
  
  .banner-title {
    font-size: 1.1rem;
    margin-bottom: 1.2rem;
  }
  
  .banner-section .scrolling-banner {
    height: 160px;
  }
  
  .footer-content {
    flex-direction: column;
    gap: 1.5rem;
    text-align: center;
  }
  
  /* 调整特别鸣谢部分 */
  .credits-section {
    align-items: center;
  }
  
  .credits-title {
    font-size: 1.1rem;
  }
  
  .credits-list {
    gap: 1.2rem;
  }
  
  .credit-item {
    padding: 0.8rem;
    min-width: 100px;
  }
  
  .credit-name {
    font-size: 1rem;
  }
  
  /* 调整模式选择器 */
  .mode-selector {
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.5rem;
    min-width: unset;
    width: 100%;
    border-radius: 10px;
  }
  
  .mode-button {
    padding: 0.8rem 1rem;
    border-radius: 8px;
  }

  .header-button-container {
    top: 15px; /* 移动到左上角，与右侧用户信息垂直对齐 */
    left: 20px;
  }

  /* ========================================================
     顶部统一整条导航栏（下拉栏）移动端极简自适应重构
     ======================================================== */
  .global-top-bar {
    height: 52px !important; /* 深度缩小高度，由 76px 缩至 52px */
    transform: translateY(-44px) !important; /* 收起时向上收回，仅露出下边缘 8px 用作指示器触发 */
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
    gap: 6px !important;
  }

  .global-top-bar.expanded {
    transform: translateY(0) !important; /* 展开状态 */
  }

  /* 下拉指示器同步位置缩减 */
  .global-top-bar .top-bar-indicator {
    bottom: -20px !important;
    height: 20px !important;
    width: 66px !important;
    border-radius: 0 0 11px 11px !important;
    font-size: 14px !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  
  .global-top-bar .top-bar-indicator:hover {
    bottom: -22px !important;
    height: 22px !important;
  }

  .global-top-bar.expanded .top-bar-indicator {
    height: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /* 1. 左侧：导航菜单 */
  .navigation-menu {
    position: relative !important; /* 改为 relative 保证下拉子菜单以它为基准定位 */
    top: auto !important;
    left: auto !important;
    transform: none !important;
    margin: 0 !important;
    z-index: 10002 !important;
    display: flex !important;
    align-items: center !important;
  }

  /* 导航按钮整体变小，变为纯图标圆形按钮 */
  .navigation-button {
    width: 32px !important;
    height: 32px !important; /* 高度从 44px 缩到 32px */
    padding: 0 !important; /* 移除内边距 */
    border-radius: 50% !important; /* 变为圆形 */
    justify-content: center !important;
    align-items: center !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
  }

  .navigation-button .navigation-icon {
    font-size: 13px !important; /* 缩小图标 */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .navigation-button .navigation-text {
    display: none !important; /* 隐藏文字 */
  }

  /* 导航下拉菜单适配及内容等比例缩小 */
  .navigation-dropdown {
    top: calc(100% + 6px) !important;
    min-width: 180px !important;
    width: 230px !important;
    border-radius: 12px !important;
  }

  .navigation-drag-hint {
    padding: 6px 12px !important;
    font-size: 10px !important;
  }

  .navigation-drag-hint i {
    font-size: 12px !important;
  }

  .navigation-option {
    padding: 8px 12px !important;
    gap: 8px !important;
  }

  .option-drag-handle {
    width: 16px !important;
    height: 16px !important;
    font-size: 11px !important;
  }

  .option-icon {
    width: 28px !important;
    height: 28px !important;
    border-radius: 6px !important;
    font-size: 14px !important;
  }

  .option-content {
    gap: 1px !important;
  }

  .option-title {
    font-size: 12px !important;
  }

  .option-desc {
    font-size: 10px !important;
  }

  .arrow-icon {
    font-size: 14px !important;
  }

  .navigation-option-download .arrow-icon {
    font-size: 14px !important;
  }

  /* 2. 中间：常用入口胶囊（灵动岛） */
  .dynamic-island-portal {
    position: relative !important; /* 改为 relative 保证气泡定位 */
    top: auto !important;
    left: auto !important;
    transform: none !important;
    margin: 0 !important;
    pointer-events: auto !important;
    z-index: 10001 !important;
    flex: 1 !important;
    display: flex !important;
    justify-content: center !important;
    min-width: 0 !important;
  }

  /* 灵动岛主胶囊极简化 */
  .dynamic-island {
    height: 32px !important; /* 高度从 44px/40px 缩到 32px */
    min-width: unset !important; /* 移除最小宽度约束，支持灵活缩小 */
    max-width: 120px !important; /* 严格限制最大宽度，为两侧按钮挪出排版空间 */
    padding: 0 4px !important;
    border-radius: 16px !important;
    justify-content: center !important;
    box-shadow: 
      0 2px 10px rgba(0, 0, 0, 0.4),
      0 0 8px rgba(0, 170, 255, 0.15) !important;
  }

  /* 隐藏里面的发光玻璃高光层 */
  .island-glass-shimmer {
    display: none !important;
  }

  .island-shortcuts {
    gap: 1px !important;
    justify-content: center !important;
    width: 100% !important;
  }

  /* 单个快捷入口按钮极简化 */
  .island-shortcut-btn {
    padding: 2px 5px !important; /* 深度缩小内边距 */
    gap: 0 !important;
    height: 24px !important;
    border-radius: 12px !important;
  }

  .island-shortcut-icon {
    font-size: 12px !important; /* 缩小快捷小图标 */
  }

  .island-shortcut-label {
    display: none !important; /* 移动端彻底隐藏快捷入口文本，仅保留纯图标 */
  }

  /* 分割线位置自适应微调 */
  .island-shortcuts .island-shortcut-btn:not(:last-child)::after {
    top: 30% !important;
    height: 40% !important;
    right: 0px !important;
  }

  /* 3. 右侧：设置与公告组件 */
  .settings-menu {
    position: relative !important; /* 改为 relative */
    top: auto !important;
    right: auto !important;
    transform: none !important;
    margin: 0 !important;
    gap: 5px !important; /* 紧凑间距 */
    z-index: 10002 !important;
    display: flex !important;
    align-items: center !important;
  }

  /* 公告喇叭按钮 */
  .announcement-button {
    width: 32px !important; /* 高宽完美等高对齐 32px */
    height: 32px !important;
    font-size: 13px !important; /* 稍微缩小喇叭图标 */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
  }

  /* 设置按钮变为纯图标圆形按钮 */
  .settings-button {
    width: 32px !important;
    height: 32px !important; /* 高度从 44px 缩到 32px */
    padding: 0 !important;
    border-radius: 50% !important;
    justify-content: center !important;
    align-items: center !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
  }

  .settings-button .settings-icon {
    font-size: 13px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .settings-button .settings-text {
    display: none !important; /* 隐藏文字 */
  }

  /* 设置下拉菜单适配及内容等比例缩小 */
  .settings-dropdown {
    top: calc(100% + 6px) !important;
    right: 0 !important;
    left: auto !important;
    min-width: 180px !important;
    width: 220px !important;
    border-radius: 12px !important;
  }

  .settings-section {
    padding: 6px !important;
  }

  .settings-option {
    padding: 8px 10px !important;
    gap: 8px !important;
    font-size: 11px !important;
    margin: 1px !important;
    width: calc(100% - 2px) !important;
  }

  .user-option {
    padding: 6px 8px !important;
  }

  .user-avatar {
    width: 26px !important;
    height: 26px !important;
    font-size: 12px !important;
  }

  .username {
    font-size: 12px !important;
  }

  .credits-info-container {
    padding: 0 6px 6px !important;
  }

  .credits-balance-menu {
    padding: 6px 10px !important;
  }

  .credits-text {
    gap: 3px !important;
  }

  .credits-text span {
    font-size: 10px !important;
  }

  .credits-amount {
    font-size: 12px !important;
  }

  .credits-balance-menu button,
  .super-vip-info-container button {
    font-size: 10px !important;
    padding: 3px 6px !important;
  }

  .super-vip-info-container {
    padding: 8px 10px !important;
    gap: 6px !important;
  }

  .super-vip-info-container span {
    font-size: 11px !important;
  }

  .language-toggle {
    gap: 6px !important;
    padding: 2px !important;
  }

  .lang-btn {
    padding: 6px !important;
    font-size: 11px !important;
    gap: 4px !important;
  }

  .option-flag {
    font-size: 13px !important;
  }

  .logout-button {
    padding: 6px 8px !important;
  }

  .logout-button .option-icon {
    font-size: 13px !important;
    margin-right: 6px !important;
  }

  .credits-warning {
    font-size: 10px !important;
    margin-top: 4px !important;
  }

  /* 内容型页面强制开启滚动（作品展示/仓库/详情/个人中心） */
  .showcase-page,
  .my-works-page,
  .showcase-detail-page,
  .profile-page {
    min-height: 100dvh !important;
    height: auto !important;
    overflow: visible !important;
  }
}

/* Gemini-inspired mobile workspace chrome */
@media (max-width: 768px) {
  .global-top-bar,
  .global-top-bar.expanded {
    height: calc(64px + env(safe-area-inset-top)) !important;
    padding: env(safe-area-inset-top) 16px 0 !important;
    transform: none !important;
    gap: 0 !important;
    background: rgba(15, 17, 24, 0.88) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
    box-shadow: none !important;
    backdrop-filter: blur(22px) saturate(150%) !important;
    -webkit-backdrop-filter: blur(22px) saturate(150%) !important;
  }

  .global-top-bar .top-bar-indicator,
  .global-top-bar .top-bar-separator,
  .global-top-bar .dynamic-island-portal,
  .global-top-bar .announcement-button,
  .global-top-bar .checkin-entry-button {
    display: none !important;
  }

  .global-top-bar .navigation-menu,
  .global-top-bar .settings-menu {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    z-index: 10002 !important;
  }

  .global-top-bar .navigation-button,
  .global-top-bar .settings-button {
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    color: var(--text-color) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }

  .global-top-bar .navigation-icon,
  .global-top-bar .settings-icon {
    color: inherit !important;
    font-size: 25px !important;
  }

  .global-top-bar .settings-menu {
    margin-left: auto !important;
  }

  .mobile-top-bar-title {
    position: absolute;
    top: env(safe-area-inset-top);
    left: 64px;
    right: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    height: 64px;
    padding: 0 10px;
    overflow: hidden;
    color: var(--text-color);
    background: transparent;
    border: 0;
    font: inherit;
    font-size: 18px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
  }

  .mobile-top-bar-title span {
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .mobile-top-bar-title i {
    flex: 0 0 auto;
    font-size: 21px;
    transition: transform 0.2s ease;
  }

  .mobile-top-bar-title:disabled {
    opacity: 1;
    cursor: default;
  }

  .mobile-top-bar-title:disabled i {
    display: none;
  }

  .navigation-dropdown,
  .settings-dropdown {
    top: calc(100% + 10px) !important;
  }

  html[data-theme='light'] .global-top-bar,
  html[data-theme='light'] .global-top-bar.expanded {
    background: rgba(255, 255, 255, 0.9) !important;
    border-bottom-color: rgba(32, 33, 36, 0.06) !important;
  }

  html[data-theme='light'] .global-top-bar .navigation-button,
  html[data-theme='light'] .global-top-bar .settings-button {
    color: #202124 !important;
    background: transparent !important;
  }
}

/* 平板设备优化 (768px-1199px) */
@media (min-width: 769px) and (max-width: 1199px) {
  .container,
  .container.threejs-mode,
  .container.solve-mode {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto auto !important;
    padding: 0 2rem 2.5rem;
    gap: 2rem;
    max-width: 800px;
    margin: 0 auto;
  }
  
  /* 强制模式选择器也使用单列布局 */
  .mode-selector {
    grid-column: 1 / -1 !important;
    min-width: unset !important;
    max-width: 100% !important;
  }
  
  .card {
    padding: 1.5rem;
  }
  
  header {
    padding: 2.5rem 2rem;
  }
}

/* 小屏幕设备额外优化 */
@media (max-width: 480px) {
  html, body {
    font-size: 14px;
  }
  
  body.route-scroll-locked .container {
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }
  
  /* 强制模式选择器也使用单列布局 */
  .mode-selector {
    min-width: unset !important;
    max-width: 100% !important;
  }
  
  /* 强制所有模式下的容器在超小屏幕下也遵循一屏 flex 布局 */
  body.route-scroll-locked .container,
  body.route-scroll-locked .container.threejs-mode,
  body.route-scroll-locked .container.solve-mode {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }
  
  .card {
    padding: 1rem;
    border-radius: 8px;
  }
  
  /* 头部元素进一步缩小 */
  header {
    padding: 1.5rem 1rem;
  }
  
  .logo {
    font-size: 2rem;
    letter-spacing: 2px;
    margin-bottom: 0.3rem;
  }
  
  .logo-badge {
    right: -20px;
    top: -2px;
    font-size: 0.8rem;
    padding: 0.1rem 0.4rem;
  }
  
  .tagline {
    font-size: 0.9rem;
    margin-bottom: 0.3rem;
  }
  
  .tagline-en {
    font-size: 0.75rem;
    margin-bottom: 1rem;
    letter-spacing: 0.6px;
  }
  
  /* 微调模式选择器 */
  .mode-button {
    padding: 0.7rem 0.8rem;
  }
  
  /* 调整页脚更加紧凑 */
  .tech-footer {
    padding: 1.5rem 1rem;
  }
  
  .banner-title {
    font-size: 1rem;
    margin-bottom: 1rem;
  }
  
  .banner-section .scrolling-banner {
    height: 140px;
  }
  
  .footer-divider {
    width: 60%;
  }
  
  /* 调整特别鸣谢样式 */
  .credits-list {
    gap: 1rem;
  }
  
  .credit-item {
    padding: 0.7rem;
    min-width: 90px;
  }
  
  /* 优化公告弹窗 */
  .modal-content {
    padding: 1.5rem 1.2rem;
  }
  
  .modal-content h2 {
    font-size: 1.3rem;
  }
}

/* 修复移动端上常见的滚动和溢出问题 */
@media (max-width: 768px) {
  /* 修复输入/响应区域宽度溢出 */
  .input-container,
  .response-container,
  .animation-container {
    max-width: 100vw;
    overflow-x: hidden;
  }
  
  /* 确保代码区域可以水平滚动 */
  .code-block,
  pre,
  .fixed-code {
    white-space: pre;
    overflow-x: auto;
    max-width: 100%;
  }
  
  /* 确保图片和视频不会溢出容器 */
  img, video {
    max-width: 100%;
    height: auto;
  }
  
  /* 针对不同移动设备优化浮动图标尺寸 */
  .floating-logo {
    transform: scale(0.8);
    right: 20px;
    bottom: 20px;
  }
  
  /* 确保弹窗在小屏幕上正常显示 */
  .modal-overlay .modal-content {
    width: 95%;
    max-width: 95%;
    max-height: 80vh;
    overflow-y: auto;
    margin: 10px;
    padding: 1.2rem;
  }

  /* 隐藏页脚，节省移动端屏幕纵向空间 */
  .tech-footer, .footer, footer {
    display: none !important;
  }

  /* 统一面板布局自适应，确保不产生全局滚动条 */
  .manim-unified-panel,
  .threejs-unified-panel,
  .qq-unified-panel,
  .solve-unified-panel,
  .geogebra-unified-panel {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
    height: 100% !important;
    min-height: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    position: relative !important;
  }

  /* GeoGebra 控制面板在移动端不占高度，仅显示悬浮的输入框 */
  .geogebra-control-panel {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    height: 0 !important;
    min-height: 0 !important;
  }

  /* 强制面板内部卡片和视图充满剩余空间，不允许溢出滚动 */
  .panel-content {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 0;
    visibility: hidden;
    overflow: hidden !important;
  }

  .panel-content.active {
    opacity: 1 !important;
    visibility: visible !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    min-height: 0 !important;
  }

  /* 强制卡片、预览区、响应区铺满剩余视口 */
  .geogebra-preview,
  .animation-preview,
  .response-area,
  .threejs-preview,
  .solve-left-panel {
    flex: 1 !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    border-radius: 0 !important; /* 去除圆角，边缘贴合更显原生 */
    border: none !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  /* 解题分析、QQ模式等文本/问答响应区，允许内部文章独立滚动，但不允许外层窗口滑动 */
  .response-container,
  .response-content {
    flex: 1 !important;
    overflow-y: auto !important;
    min-height: 0 !important;
    padding-bottom: 20px !important;
  }

  /* 确保 GeoGebra 视图容器在移动端绝对铺满且保持舒适的高宽比例 */
  .geogebra-viewer,
  .geogebra-viewer .viewer-content,
  .geogebra-wrapper {
    height: 100% !important;
    width: 100% !important;
    flex: 1 !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important; /* 去除原生灰色背景，融合进黑色科技卡片中 */
  }

  /* 强力优化移动端 GeoGebra 的画板长宽比与可视面积，使其不再受到高度压缩而显得极扁 */
  .geogebra-preview {
    margin: 4px 10px 4px 10px !important; /* 深度缩小底边距，将下方大面积留白完全消化 (原10px) */
    border-radius: 12px !important; /* 给主体画板增加精美适度的圆角 */
    border: 1px solid rgba(0, 170, 255, 0.2) !important; /* 增加精致科技感蓝色边框 */
    background: linear-gradient(180deg, rgba(15, 17, 28, 0.4) 0%, rgba(10, 12, 22, 0.6) 100%) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
    flex: 1 !important;
    height: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }

  /* 确保 3D 和动画视频区域高度自适应，防止挤压 */
  .animation-container,
  .threejs-container {
    flex: 1 !important;
    height: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: #000;
  }
}

/* 移动端弹窗优化样式 */
@media (max-width: 768px) {
  /* 新用户指南弹窗优化 */
  .new-user-guide-modal-content {
    width: 90%;
    max-width: 90%;
    max-height: 85vh;
    overflow-y: auto;
    margin: 0;
    padding: 25px 20px;
    border-radius: 12px;
  }
  
  .new-user-guide-modal-content h2 {
    font-size: 1.4rem;
    margin-bottom: 10px;
  }
  
  .guide-section {
    padding-left: 12px;
    margin-bottom: 20px;
  }
  
  .guide-section h3 {
    font-size: 1.1rem;
    margin-bottom: 8px;
  }
  
  .guide-section ul {
    padding-left: 5px;
  }
  
  .guide-section li {
    margin-bottom: 8px;
    font-size: 0.95rem;
  }
  
  .guide-close-btn {
    padding: 10px;
    font-size: 0.95rem;
  }
  
  /* 通用弹窗容器优化 */
  .modal-overlay .modal-content {
    width: 92%;
    max-width: 92%;
    max-height: 80vh;
    overflow-y: auto;
    padding: 20px 16px;
  }
  
  /* 公告弹窗优化 */
  .announcement-item {
    padding: 16px;
  }
  
  .announcement-item h3 {
    font-size: 1.1rem;
  }
  
  .announcement-item p {
    font-size: 0.95rem;
  }
  
  /* 社区/俱乐部图片弹窗 */
  .image-modal-content {
    width: 90%;
    padding: 16px;
  }
  
  .enlarged-community-image {
    max-width: 100%;
    max-height: 60vh;
  }
  
  .scan-hint {
    font-size: 1rem;
    margin-top: 15px;
  }
  
  /* 修复弹窗优化 */
  .fix-modal-content {
    width: 90%;
    padding: 20px 16px;
  }
  
  .credit-explanation-modal-content {
    width: 90%;
    padding: 20px;
  }
}

/* 小屏幕设备额外优化 */
@media (max-width: 480px) {
  /* 新用户指南弹窗进一步优化 */
  .new-user-guide-modal-content {
    width: 95%;
    padding: 20px 16px;
  }
  
  .new-user-guide-modal-content h2 {
    font-size: 1.3rem;
  }
  
  .guide-section h3 {
    font-size: 1rem;
  }
  
  .guide-section li {
    font-size: 0.9rem;
    line-height: 1.5;
  }
  
  /* 确保关闭按钮容易点击 */
  .close-modal-btn {
    padding: 8px;
    font-size: 1.6rem;
    height: 32px;
    width: 32px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
  }
  
  /* 水印设置弹窗优化 */
  .watermark-modal-content {
    width: 95%;
    max-height: 85vh;
  }
  
  .watermark-modal-header, 
  .watermark-modal-body,
  .watermark-modal-footer {
    padding: 15px;
  }
  
  .watermark-modal-footer {
    flex-direction: column;
    gap: 10px;
  }
  
  .watermark-modal-footer button {
    width: 100%;
    justify-content: center;
  }
  
  /* 确保内容垂直居中 */
  .modal-overlay, 
  .new-user-guide-modal-overlay,
  .credit-explanation-modal-overlay,
  .image-modal-overlay {
    align-items: center;
    justify-content: center;
    padding: 20px 0;
  }
} 

/*# sourceMappingURL=/src.0b67005b.css.map */