:root {
  /* 定义全局CSS变量，用于主题颜色和透明度 */
  --mio-main: 255, 255, 255;
  --mio-text: 0, 0, 0;
  --mio-primary: 100, 209, 226; /* 主题色 #64d1e2 偏蓝 */
  --mio-primary50: 63, 194, 214;
  --mio-main-opacity: 0.5;
  --hope-colors-info9: rgba(var(--mio-primary), 1);
  --hope-colors-info4: rgba(var(--mio-primary), 1);
  --hope-colors-info5: rgba(var(--mio-primary50), 1);
  --hope-colors-info11: rgba(var(--mio-main), 1);
}

.hope-ui-dark {
  /* 定义暗色模式下的CSS变量 */
  --mio-main: 0, 0, 0;
  --mio-text: 255, 255, 255;
  --mio-main-opacity: 0.5;
  --hope-colors-info9: rgba(var(--mio-primary), 1);
  --hope-colors-info4: rgba(var(--mio-primary), 0.4);
  --hope-colors-info5: rgba(var(--mio-primary50), 0.4);
  --hope-colors-info11: rgba(var(--mio-primary50), 1);
}

@font-face {
  /* 引入自定义字体 Yozai */
  font-family: "Yozai";
  src: url("../font/Yozai-Regular.ttf") format("truetype");
}

@font-face {
  /* 引入自定义字体 HYTMR */
  font-family: "HYTMR";
  src: url("https://npm.elemecdn.com/fontcdn-ariasaka@1.0.0/HYTangMeiRen55W.woff2") format("woff2");
}

html, body {
  /* 设置页面基础样式，清除默认边距并确保占满视口 */
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
  background: none !important;
  overflow-x: hidden;
  overflow-y: auto;
}

div#root {
  /* AList根容器，确保内容层级高于背景 */
  position: relative;
  z-index: 1;
  background: transparent !important;
  margin: 0;
  padding: 0;
  width: 100%;
  min-height: 100vh;
}

/* 背景图片 */
.custom-background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
  filter: blur(1px);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transform: scale(1.03); /* 恢复放大 */
  transform-origin: center; /* 放大从中心开始 */
}

body.hope-ui-light .custom-background {
  /* 亮色模式下调整背景亮度和模糊度 */
  filter: blur(1px) brightness(0.6);
}

body.hope-ui-dark .custom-background {
  /* 暗色模式下调整背景亮度和模糊度 */
  filter: blur(1px) brightness(0.6);
}

@media screen and (max-width: 767px) {
  body.hope-ui-light .custom-background {
      filter: blur(3px) brightness(0.8);
  }
  body.hope-ui-dark .custom-background {
      filter: blur(3px) brightness(0.8);
  }
}

div#root div.footer {
  /* 设置页面底部文字颜色 */
  color: white !important;
}

/* 文件列表模糊效果 */
div#root div.body div.obj-box {
  /* 文件列表区域的背景和模糊效果 */
  background-color: rgba(var(--mio-main), var(--mio-main-opacity));
  min-height: auto;
  max-height: none;
  overflow-y: visible;
  backdrop-filter: blur(5px) !important;
  -webkit-backdrop-filter: blur(5px) !important;
  /* 隐藏所有平台的滚动条 */
  -ms-overflow-style: none; /* IE和Edge */
  scrollbar-width: none; /* Firefox */
}

div#root div.body div.obj-box::-webkit-scrollbar {
  /* 隐藏Webkit内核浏览器(Chrome/Safari)的滚动条 */
  display: none;
}

/* ✅ 适配所有浏览器，隐藏滚动条但允许滚动 */

/* 对于 WebKit 核心浏览器 (Chrome, Safari, Edge) */
html, body {
  overflow-y: scroll; /* 允许垂直滚动 */
  overflow-x: hidden; /* 禁止水平滚动 */
}

::-webkit-scrollbar {
  width: 0; /* 滚动条宽度为 0，实现隐藏 */
  height: 0; /* 横向滚动条也隐藏 */
}

/* 对于 Firefox 浏览器 */
html, body {
  scrollbar-width: none; /* 隐藏滚动条但保留滚动 */
}

/* 针对 IE 和 Edge 浏览器 */
html, body {
  -ms-overflow-style: none; /* 隐藏滚动条但保留滚动 */
}

/* 针对 obj-box 文件列表区域隐藏滚动条 */
div#root div.body div.obj-box {
  overflow-y: scroll; /* 允许垂直滚动 */
  overflow-x: hidden; /* 隐藏水平滚动条 */
}

/* 针对 iOS 设备的兼容处理 */
@supports (-webkit-touch-callout: none) {
  html, body {
      overflow-y: scroll !important; /* 允许滚动 */
      -webkit-overflow-scrolling: touch; /* iOS 下的惯性滚动 */
  }
}


div#root div.body div.obj-box::-webkit-scrollbar {
  /* 文件列表滚动条的宽度和过渡效果 */
  width: 4px;
  transition: all 0.3s ease-in-out;
}

/* Markdown显示框模糊效果 */
div#root div.body div.hope-c-PJLV-ikSuVsl-css,
div#root div.body .hope-c-PJLV-iiuDLME-css {
  /* Markdown内容区域的背景和模糊效果 */
  background-color: rgba(var(--mio-main), var(--mio-main-opacity));
  backdrop-filter: blur(5px) !important;
  -webkit-backdrop-filter: blur(5px) !important;
}

/* 右边工具栏 */
div#root div.body div.hope-c-PJLV-ieGWMbI-css {
  /* 右侧工具栏的背景样式 */
  background-color: rgba(var(--mio-main), var(--mio-main-opacity));
}

/* 头部 */
div#root div.hope-c-PJLV-iiLzBwx-css header {
  /* 页面顶部导航栏的背景样式 */
  background-color: rgba(var(--mio-main), 0.3);
}

/* 侧边栏 */
div.hope-c-PJLV-ibpTetR-css > div:first-child {
  /* 左侧侧边栏的背景样式 */
  background-color: rgba(var(--mio-main), 0.3);
}

div.hope-c-PJLV-ibpTetR-css > div:first-child div.hope-c-PJLV-ibBheSN-css {
  /* 侧边栏标题文字颜色 */
  color: var(--mio-main);
}

/* tag a */
div.hope-c-PJLV-ibpTetR-css > div:first-child a.hope-c-PJLV-ikmVjeJ-css {
  /* 侧边栏中的标签链接样式 */
  color: rgba(var(--mio-primary));
  background-color: rgba(var(--mio-primary), 0.2);
}

/* 暗色模式 */
div.hope-c-PJLV-ibpTetR-css > div:first-child .hope-c-PJLV-ijrehjy-css {
  /* 侧边栏暗色模式下的背景样式 */
  background: rgba(var(--mio-main), 0.3);
}

/* 亮色模式 */
div.hope-c-PJLV-ibpTetR-css > div:first-child .hope-c-PJLV-ikaEncD-css {
  /* 侧边栏亮色模式下的背景样式 */
  background: rgba(var(--mio-primary), 0.3);
}

/* 主内容区卡片 */
div.hope-c-PJLV-ibpTetR-css div.hope-c-PJLV-ijycFhp-css div.hope-c-PJLV-iiBrJnl-css,
div.hope-c-PJLV-ibpTetR-css div.hope-c-PJLV-ijycFhp-css div.hope-c-PJLV-iiVJRSE-css {
  /* 文件卡片的背景和过渡效果 */
  transition: all 0.2s ease-in-out;
  background: rgba(var(--mio-main), 0.3);
}

div.hope-c-PJLV-ibpTetR-css div.hope-c-PJLV-ijycFhp-css div.hope-c-PJLV-iiBrJnl-css:hover,
div.hope-c-PJLV-ibpTetR-css div.hope-c-PJLV-ijycFhp-css div.hope-c-PJLV-iiVJRSE-css:hover {
  /* 文件卡片悬停时的边框颜色 */
  border-color: rgba(var(--mio-primary), 0.7);
}

/* 字段 */
.hope-c-kvTTWD-hYRNAb-variant-filled {
  /* 输入字段的背景样式 */
  background-color: rgba(var(--mio-main), 0.2);
}

.hope-c-kvTTWD-hYRNAb-variant-filled:hover,
.hope-c-kvTTWD-hYRNAb-variant-filled:focus {
  /* 输入字段悬停和聚焦时的样式 */
  background-color: rgba(var(--mio-main), 0.7);
  border-color: rgba(var(--mio-primary), 0.5);
}

/* 开关 */
.hope-c-mHASU-byiOue-variant-filled {
  /* 开关组件的默认样式 */
  color: rgb(var(--mio-primary), 0.5);
  background-color: rgba(var(--mio-main), 0.2);
}

.hope-c-mHASU-byiOue-variant-filled[data-checked] {
  /* 开关选中时的背景颜色 */
  background-color: currentcolor;
}

.hope-c-mHASU-byiOue-variant-filled[data-focus] {
  /* 开关聚焦时的阴影和边框 */
  box-shadow: 0 0 0 3px var(--mio-primary);
  border-color: var(--mio-primary);
}

/* 头部 */
div#root div.header {
  /* 顶部导航栏的背景 */
  background: transparent;
}

div#root div.header .header-left {
  /* 顶部导航栏左侧区域的尺寸 */
  width: 40px;
  height: 40px;
}

div#root div.header .header-right > button {
  /* 顶部导航栏右侧按钮的背景 */
  background: transparent;
}

div#root div.header svg {
  /* 顶部导航栏中的图标颜色 */
  color: rgba(var(--mio-primary));
}

/* 内容部分 */
div#root div.body {
  /* 主内容区域的最小高度 */
  min-height: calc(100vh - 102px);
}

/* 导航部分 */
div#root div.body nav.nav {
  /* 文件路径导航栏的文字颜色和背景 */
  color: #fff;
  background: transparent;
}

div#root div.body nav.nav::after {
  /* 导航栏底部的分隔线背景 */
  background-color: transparent;
}

div#root div.body div.obj-box span.hope-c-iojPKw svg {
  /* 文件列表中图标的颜色 */
  color: rgba(var(--mio-main), 1);
}

/* Markdown */
.markdown-body {
  /* Markdown内容的字体 */
  font-family: inherit !important;
}

h1, h2 {
  /* Markdown标题的下边框 */
  border-bottom: none !important;
}

.markdown-body > ul > li::marker {
  /* Markdown无序列表的项目符号颜色 */
  color: rgba(var(--mio-primary), 1);
}

/* 侧边栏内部元素 */
div#root div.body div.hope-c-PJLV-ieGWMbI-css p.hope-c-PJLV-iZZmce-css {
  /* 侧边栏高亮项的背景颜色 */
  background-color: rgba(var(--mio-primary), 0.7);
}

div#root div.body div.hope-c-PJLV-ieGWMbI-css p.hope-c-PJLV-igSqJIB-css {
  /* 侧边栏文本的溢出处理 */
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 200px;
}

div#root div.body svg {
  /* 主内容区图标颜色 */
  color: rgba(var(--mio-primary));
}

/* 工具栏 */
div.left-toolbar-box,
div.center-toolbar {
  /* 工具栏的层级 */
  z-index: 1;
}

div.left-toolbar-box div.left-toolbar {
  /* 左侧工具栏的背景样式 */
  background-color: rgba(var(--mio-main), 0.3);
}

div.left-toolbar-box div.left-toolbar svg.hope-icon,
div.left-toolbar-box svg.hope-icon {
  /* 左侧工具栏图标颜色 */
  color: rgba(var(--mio-primary));
}

div.left-toolbar-box div.left-toolbar svg.hope-icon:hover,
div.left-toolbar-box svg.hope-icon:hover {
  /* 左侧工具栏图标悬停时的样式 */
  color: rgba(255, 255, 255, 1);
  background-color: rgba(var(--mio-primary));
}

/* 返回顶部 */
div.hope-c-PJLV-ihMpUpe-css {
  /* 返回顶部按钮的背景颜色 */
  background-color: rgba(var(--mio-primary)) !important;
}

/* tooltip提示 */
div.hope-tooltip {
  /* 提示框的文字和背景颜色 */
  color: rgba(255, 255, 255, 1);
  background-color: rgba(var(--mio-primary), 1);
}

/* 加载图标 */
div.hope-spinner {
  /* 加载动画的颜色 */
  color: rgba(var(--mio-primary));
}

/* menu下拉区域 */
div.hope-menu__content {
  /* 下拉菜单的背景样式 */
  background-color: rgba(var(--mio-main), var(--mio-main-opacity));
}

/* select下拉区域 */
div.hope-c-XJURY {
  /* 选择框下拉区域的背景样式 */
  background: rgba(var(--mio-main), 0.8);
}

/* 登录页 */
div.hope-c-PJLV-ibcBsNO-css .hope-c-PJLV-ifJliWT-css,
div.hope-c-PJLV-ibcBsNO-css .hope-c-PJLV-igjRXTJ-css {
  /* 隐藏登录页的某些元素 */
  display: none;
}

div.hope-c-PJLV-ibcBsNO-css div.hope-c-PJLV-ibiABng-css,
div.hope-c-PJLV-ibcBsNO-css div.hope-c-PJLV-ihWgyFw-css {
  /* 登录页背景区域的样式 */
  background-color: transparent;
}

/* 登录框 */
div.hope-c-PJLV-ibcBsNO-css div.hope-c-PJLV-iubUra-css,
div.hope-c-PJLV-ibcBsNO-css .hope-c-PJLV-ifjOQLV-css {
  /* 登录框的背景和模糊效果 */
  background-color: rgba(var(--mio-main), 0.5);
  backdrop-filter: blur(5px);
}

div.hope-c-PJLV-ibcBsNO-css div.hope-c-PJLV-idKXllh-css a {
  /* 隐藏登录框中的链接 */
  display: none;
}

/* 媒体查询：平板设备（如iPad） */
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .custom-background {
      /* iPad端的背景图片样式 */
      width: 100vw;
      height: 100vh;
      background-size: cover;
      background-position: center;
  }
  div#root div.body div.obj-box {
      /* iPad端文件列表的模糊效果 */
      backdrop-filter: blur(5px) !important;
      -webkit-backdrop-filter: blur(5px) !important;
  }
  div#root div.body div.hope-c-PJLV-ikSuVsl-css,
  div#root div.body .hope-c-PJLV-iiuDLME-css {
      /* iPad端Markdown显示框的模糊效果 */
      backdrop-filter: blur(5px) !important;
      -webkit-backdrop-filter: blur(5px) !important;
  }
}

/* 媒体查询：小屏幕（如手机） */
@media screen and (max-width: 767px) {
  .custom-background {
      width: 100vw;
      height: 100vh;
      background-size: cover;
      background-position: center;
      transform: scale(1.03); /* 确保手机端也放大 */
      transform-origin: center;
      filter: blur(3px); /* 手机端模糊度3px */
  }
}


/* 媒体查询：更大的平板（如iPad Pro横屏） */
@media screen and (min-width: 1025px) and (max-width: 1366px) {
  .custom-background {
      /* 大平板端的背景图片样式 */
      width: 100vw;
      height: 100vh;
      background-size: cover;
      background-position: center;
  }
}

/* 强制覆盖可能的浏览器默认样式 */
* {
  border: none !important;
  outline: none !important;
}