/* =========================================================
   精英出海 · 全站星际玻璃主题 V5
   仅负责公共前台视觉层，不修改业务逻辑/数据库/API
   ========================================================= */

:root{
  --jy-space-line:rgba(86,185,255,.35);
  --jy-space-line-strong:rgba(88,211,255,.70);
  --jy-space-panel:rgba(5,21,52,.58);
  --jy-space-panel-strong:rgba(5,18,46,.72);
  --jy-space-text:#f1f7ff;
  --jy-space-muted:#9eb7d6;
}

html{
  background:#020714 !important;
}

body{
  position:relative;
  isolation:isolate;
  min-height:100vh;
  background:#020714 !important;
  color:var(--jy-space-text);
}

/* 真正的全站底图：固定在所有公共页面后方 */
body::before{
  content:"";
  position:fixed;
  z-index:0;
  inset:-5.5%;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(1,7,22,.24),rgba(1,8,24,.42) 48%,rgba(1,7,20,.72) 100%),
    url('/assets/jy-global-space-bg.webp') center center / cover no-repeat;
  filter:saturate(1.12) brightness(.88) contrast(1.03);
  transform:translate3d(-.35%,0,0) scale(1.075);
  transform-origin:center;
  animation:none;
  will-change:auto;
}

/* 轻微蓝紫光流，让静态底图看起来有呼吸感 */
body::after{
  content:"";
  position:fixed;
  z-index:0;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 18% 33%,rgba(112,77,255,.14),transparent 31%),
    radial-gradient(ellipse at 78% 24%,rgba(56,188,255,.13),transparent 29%),
    linear-gradient(105deg,transparent 14%,rgba(65,128,255,.055) 47%,rgba(172,78,255,.06) 66%,transparent 84%);
  background-size:115% 115%,120% 120%,160% 100%;
  mix-blend-mode:screen;
  opacity:.72;
  animation:none;
}

/* 保证页面真实内容永远位于全站背景上方 */
body > *{
  z-index:1;
}

@keyframes jyGlobalSpaceDrift{
  0%{
    transform:translate3d(-1.0%,-.3%,0) scale(1.075);
    filter:saturate(1.08) brightness(.84) contrast(1.02);
  }
  50%{
    transform:translate3d(.35%,.25%,0) scale(1.09);
    filter:saturate(1.17) brightness(.91) contrast(1.04);
  }
  100%{
    transform:translate3d(1.0%,-.15%,0) scale(1.08);
    filter:saturate(1.12) brightness(.87) contrast(1.03);
  }
}

@keyframes jyGlobalAurora{
  from{
    background-position:0% 0%,100% 0%,0% 50%;
    opacity:.48;
  }
  to{
    background-position:5% 5%,95% 7%,100% 50%;
    opacity:.82;
  }
}

/* 关闭旧工作台自己生成的假星空/大圆球，避免叠加冲突 */
.cosmos{
  background:none !important;
  opacity:0 !important;
}
.cosmos::before,
.cosmos::after{
  display:none !important;
}

/* ===== 全站顶部栏 ===== */
.top-header,
.topbar,
body > header{
  background:linear-gradient(180deg,rgba(2,12,34,.80),rgba(3,15,40,.62)) !important;
  border-color:rgba(80,171,255,.28) !important;
  box-shadow:0 10px 30px rgba(0,0,0,.18),inset 0 -1px 0 rgba(116,202,255,.05) !important;
  backdrop-filter:blur(5px) saturate(120%) !important;
  -webkit-backdrop-filter:blur(5px) saturate(120%) !important;
}

/* ===== 左侧导航统一玻璃化 ===== */
.sidebar,
.site-nav{
  background:linear-gradient(160deg,rgba(6,26,63,.72),rgba(3,14,38,.54)) !important;
  border:1px solid rgba(87,177,255,.34) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 18px 44px rgba(0,0,0,.23),0 0 28px rgba(49,118,255,.08) !important;
  backdrop-filter:blur(5px) saturate(120%) !important;
  -webkit-backdrop-filter:blur(5px) saturate(120%) !important;
}

/* ===== 工作台页面标题区：透明显示星空，不再是一块纯黑区域 ===== */
.page-head{
  background:transparent !important;
}
.page-head::before{
  content:"";
  position:absolute;
  inset:4px 0 8px;
  z-index:-1;
  border-radius:24px;
  background:linear-gradient(90deg,rgba(7,28,67,.16),rgba(7,30,76,.06),rgba(86,57,176,.08));
  pointer-events:none;
}
.head-glow{
  opacity:.85 !important;
}

/* ===== 工作台 / 服务中心 / 内容卡片统一玻璃化 ===== */
.glass,
.browser,
.intro-card,
.resource-toolbar,
.resource-card,
.group-card,
.script-row,
.modal-dialog,
.panel,
.tool,
.resource-info-card,
.business-card,
.welcome,
main > .hero,
.content > .panel,
.content > .tool{
  background:linear-gradient(145deg,rgba(7,29,69,.66),rgba(4,17,44,.48)) !important;
  border-color:rgba(80,171,255,.30) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 16px 42px rgba(0,0,0,.22),0 0 24px rgba(41,111,255,.07) !important;
  backdrop-filter:blur(5px) saturate(120%) !important;
  -webkit-backdrop-filter:blur(5px) saturate(120%) !important;
}

/* 让服务中心正文保持更轻的透明度 */
.content{
  background:transparent !important;
}

/* ===== 输入框/搜索框 ===== */
.search-box,
.searchbox,
.resource-search,
.search,
input,
select,
textarea{
  background:rgba(3,17,45,.60) !important;
  border-color:rgba(83,173,255,.30) !important;
  color:#f4f8ff !important;
  backdrop-filter:blur(4px) !important;
}

/* ===== 按钮高光 ===== */
button,
.btn,
.view-btn,
.resource-btn,
.primary-btn{
  border-color:rgba(96,219,255,.58) !important;
}

/* ===== 卡片 hover 更有星际玻璃感 ===== */
.resource-card:hover,
.group-card:hover,
.script-row:hover,
.tool:hover,
.resource-info-card:hover,
.business-card:hover{
  border-color:rgba(92,218,255,.60) !important;
  box-shadow:0 16px 38px rgba(0,0,0,.25),0 0 28px rgba(65,139,255,.16) !important;
}

/* ===== 弹窗背景也使用玻璃化 ===== */
.modal-backdrop{
  background:rgba(0,5,18,.58) !important;
  backdrop-filter:none !important;
}

/* ===== 文字增强可读性 ===== */
.page-head p,
.hero p,
.resource-copy p,
.tool p,
.richText,
.scriptBody{
  color:var(--jy-space-muted) !important;
}

/* 页面过长时，底图依旧固定，不出现断层 */
main,
.layout,
.page-shell,
.workspace{
  background:transparent !important;
}

/* 手机/低性能设备减小滤镜压力，但仍保留同一底图 */
@media(max-width:760px){
  body::before{
    inset:-3%;
    transform:scale(1.05);
    animation-duration:34s;
  }
  body::after{
    opacity:.48;
  }
  .sidebar,
  .site-nav,
  .glass,
  .browser,
  .resource-card,
  .panel,
  .tool{
    backdrop-filter:blur(4px) !important;
    -webkit-backdrop-filter:blur(4px) !important;
  }
}