/* 🔷 NUI X 信息 =============================================================================================================== */
/*
 · NUCLEUS USER INTERFACE X : 2026
 · 作者：Nucleo-Galattico
 · 版本:R 10.0 for GalaDreams（2026.2）
 · 防缓存冲突代号：99999

 · 注意！该版本只适用于GalaDreams主板块服务，不包含其他服务（如 银河Wiki ）的类
 · 不包含所有控件，请勿用于自行开发
*/

/* 🔷 字体声明 =============================================================================================================== */
/* Lexend 字体家族名：ZSFT-hq */@import url("data:text/css,%40font-face%7Bfont-family%3A%22ZSFT-hq%22%3Bsrc%3Aurl(%22https%3A%2F%2Ffontsapi.zeoseven.com%2Fhq%2Fmain.woff2%22)%20format(%22woff2%22)%3Bfont-style%3Anormal%3Bfont-weight%3A100%20900%3Bfont-display%3Aswap%3B%7D");
/* 思源黑体 字体家族名：Noto Sans CJK */@import url("https://fontsapi.zeoseven.com/69/main/result.css");
/* 森泽UD黑体 字体家族名：BIZ UDGothic */@import url("https://fontsapi.zeoseven.com/254/main/result.css");


/* 🔷 HTML控件 =============================================================================================================== */
body{
  font-family: "ZSFT-hq" , "Noto Sans CJK";
  font-weight: normal;
}

h1{
  font-size: calc(28px + max(0px , (100vw - 1280px) * 0.08));
}
h2{
  font-size: calc(20px + max(0px , (100vw - 1280px) * 0.06));
}
h2::before{
  content: "◆ ";
  color: rgb(56, 56, 220);
}
h3{
  font-size: calc(18px + max(0px , (100vw - 1280px) * 0.04));
}
h3::before{
  content: "◇ ";
}
p{
  font-size: calc(15px + max(0px , (100vw - 1280px) * 0.02));
}
p::before{
  content: "　　";
}
a{text-decoration: none;}

/* 🔷 Google Material Symbols =============================================================================================================== */
@font-face {
  font-family: 'Material Symbols Outlined';
  font-style: normal;
  src: url(/Fonts/kJF1BvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oDMzByHX9rA6RzaxHMPdY43zj-jCxv3fzvRNU22ZXGJpEpjC_1v-p_4MrImHCIJIZrDCvHOej.woff2) format('woff');
}

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
}
/* 🔷 自定义控件 =============================================================================================================== */

/* 🔷== 字体特殊处理 ==🔷 */
jp{
  font-family: "ZSFT-hq" , "BIZ UDGothic";
}
extra{
  font-size: calc(12px + max(0px , (100vw - 1280px) * 0.02));
  font-style: italic;
}


/* 🔷== 按钮 ==🔷 */
.button_bilibili{
  display:block;
  padding: 8px 4px 8px 4px;
  margin-bottom: 10px;

  color: #FFF;
  font-size: calc(13px + max(0px , (100vw - 1280px) * 0.02));
  text-align: center;

  border-radius: 16px;
  background-color: rgb(255, 159, 175);

  transition: background-color 0.2s;
  user-select: none;
  cursor: pointer;
}
.button_bilibili:hover{
  background-color: rgb(235, 139, 155);
}
.button_bilibili:active{
  background-color: rgb(205, 109, 125);
}

.button_GTA{
  display:block;
  padding: 8px 4px 8px 4px;
  margin-bottom: 10px;

  color: #FFF;
  font-size: calc(13px + max(0px , (100vw - 1280px) * 0.02));
  text-align: center;

  border-radius: 16px;
  background-color: rgb(82, 91, 255);

  transition: background-color 0.2s;
  user-select: none;
  cursor: pointer;
}
.button_GTA:hover{
  background-color: rgb(68, 75, 212);
}
.button_GTA:active{
  background-color: rgb(55, 61, 168);
}

.button_music163{
  display:block;
  padding: 8px 4px 8px 4px;
  margin-bottom: 10px;

  color: #FFF;
  font-size: calc(13px + max(0px , (100vw - 1280px) * 0.02));
  text-align: center;

  border-radius: 16px;
  background-color: red;

  transition: background-color 0.2s;
  user-select: none;
  cursor: pointer;
}
.button_music163:hover{
  background-color: rgb(204, 2, 2);
}
.button_music163:active{
  background-color: rgb(168, 0, 0);
}

/* 🔷== 聚焦 ==🔷 */
.hero_main{
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100vw - var(--scrollbar));
  height: 100vh;

  color: #F0C190;
  background-color: #D84E33;
}

.hero_title{
  position: absolute;
  top: calc(50vh - 28px - max(0px , (100vw - 1280px) * 0.15));
  width: calc(100vw - var(--scrollbar));
  
  text-align: center;
  font-weight: bold;
  font-size: calc(36px + max(0px , (100vw - 1280px) * 0.15));
}

.hero_subtitle{
  position: absolute;
  top: calc(50vh - 28px - max(0px , (100vw - 1280px) * 0.15) - 10px - 28px - max(0px , (100vw - 1280px) * 0.05));
  width: calc(100vw - var(--scrollbar));

  text-align: center;
  font-weight: bold;
  font-size: calc(28px + max(0px , (100vw - 1280px) * 0.05));
}

.hero_content{
  position: absolute;
  top: calc(50vh + 28px + max(0px , (100vw - 1280px) * 0.05));
  width: calc(100vw - var(--scrollbar));

  text-align: center;
  font-size: calc(16px + max(0px , (100vw - 1280px) * 0.05));

  a{text-decoration:underline solid 2px white;color: white;}
}

.hero_video_main{
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100vw - var(--scrollbar));
  height: 100vh;
}

.hero_video_iframe{
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.hero_video_black{
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100vw - var(--scrollbar));
  height: 100vh;

  color: #FFF;
  background-color: #00000086;
  z-index: 10;
}

/* 🔷== iframe ==🔷 */
.iframe_video{
  width: 100%;
}


/* 🔷== 顶栏 ==🔷 */
.topbar_main{ /* 主体部分 */
  position: fixed;
  display: flex;

  top: 0;
  left: 0;

  width: calc(100vw - var(--scrollbar));
  height: calc(40px + max(0px , (100vw - 1280px) * 0.02));

  justify-content: space-between;

  box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1);

  background-color: white;

  overflow-y: hidden;

  z-index: 50;

  a{
    text-decoration: none;
  }
}

.topbar_left{
  display: flex;
  
  margin-left:20px;
}

.topbar_right{
  display: flex;
  justify-content: end;
  
  margin-right:20px;
}

.topbar_item{
    height: 100%;
    padding: 10px 10px 0px 10px;

    color: #000;
    font-size: calc(16px + max(0px , (100vw - 1280px) * 0.02));
    text-align: center;

    transition: background-color 0.2s , color 0.2s;
    user-select: none;
}

.topbar_item:hover{
    color: rgb(56, 56, 220);
    background-color: rgba(121, 121, 255, 0.16);
}



/* 🔷== 内容容器 ==🔷 */
.content_container_container{
    position: absolute;
    display: flex;

    top: 100vh;
    left: 3vw;
    width: calc(94vw - var(--scrollbar));

    margin-top: 40px;
}

.content_container_container_article{
    position: absolute;
    display: flex;

    top: calc(20px + 40px + max(0px , (100vw - 1280px) * 0.02));
    left: 3vw;
    width: calc(94vw - var(--scrollbar));

    margin-top: 40px;
}


.content_container_left{
    position: relative;
    top: 0;
    left: 0;
    width: calc(75%);

    padding-bottom: 100px;
}

.content_container_right{
    position: relative;
    top: 0;
    left: 10px;
    width: calc(25% - 10px);

    padding-bottom: 100px;
}

/* 🔷 自适应 =============================================================================================================== */
@media screen and (max-width: 1024px) {
    .topbar_left{margin-left:0;}
    .topbar_right{margin-right:0;}
    .content_container_container{display: block;}
    .content_container_container_article{display: block;}
    .content_container_left{width: 100%;}
    .content_container_right{width: 100%;left: 0px;}
}