/* ==========================================================================
   鲸鱼娘 · 未至之境 (Whale Girl · The Unreached) - New API 全息动态主题
   ========================================================================== */

:root, .dark, body {
  /* 基础主调背景：透明，让全息视频浮现 */
  --background: transparent !important;
  --foreground: #E8F1FF !important;

  /* 面板与卡片：薄玻璃透明蓝黑 */
  --card: rgba(10, 16, 32, 0.72) !important;
  --card-foreground: #E8F1FF !important;
  --popover: rgba(10, 16, 32, 0.88) !important;
  --popover-foreground: #E8F1FF !important;

  /* 侧边栏与头部：深色透视玻璃 */
  --sidebar: rgba(5, 7, 13, 0.75) !important;
  --sidebar-foreground: #E8F1FF !important;
  --sidebar-primary: #3A7BFF !important;
  --sidebar-accent: rgba(58, 123, 255, 0.25) !important;
  --sidebar-border: rgba(30, 58, 107, 0.6) !important;

  /* 结构线条与强调 */
  --border: rgba(30, 58, 107, 0.55) !important;
  --input: rgba(14, 25, 48, 0.75) !important;
  --ring: #39FFD1 !important;

  /* 主色调：电光蓝 & 青色状态 */
  --primary: #3A7BFF !important;
  --primary-foreground: #E8F1FF !important;
  --accent: #39FFD1 !important;
  --accent-foreground: #0A1020 !important;

  /* 次级文本 */
  --muted: rgba(20, 40, 71, 0.45) !important;
  --muted-foreground: #8FA8CC !important;

  --table-row: transparent !important;
  --table-header: rgba(10, 16, 32, 0.75) !important;
}

html, body, #root {
  background-color: #05070D !important;
  background: transparent !important;
  min-height: 100vh;
  color: #E8F1FF !important;
}

/* ── 视频容器置底 ── */
#whale-bg-container {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  z-index: -99999;
  pointer-events: none;
  background-color: #05070D;
}

#whale-bg-video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  transform: translate(-50%, -50%);
  object-fit: cover;
  filter: contrast(1.02) saturate(1.02);
  opacity: 0.95;
}

#whale-scrim {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(5,7,13,0) 0%, rgba(5,7,13,0) 80%, rgba(5,7,13,0.2) 95%, rgba(5,7,13,0.3) 100%);
  z-index: 1;
}

#whale-scanlines {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.15) 50%);
  background-size: 100% 4px;
  opacity: 0.22;
  z-index: 2;
}

/* ── 主体结构穿透 ── */
main, .main, [class*="layout"], [class*="content"], [class*="Layout"] {
  background: transparent !important;
}

/* 卡片、面板、统计块全息玻璃化 */
.card, [class*="card"], [class*="Card"], [class*="panel"], [class*="Panel"],
[role="region"], .semi-card, .semi-modal-content, [class*="dialog-content"] {
  background-color: rgba(10, 16, 32, 0.72) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border: 1px solid rgba(30, 58, 107, 0.75) !important;
  box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.45) !important;
  border-radius: 12px !important;
}

/* 侧边导航与顶栏 */
header, nav, aside, [class*="sidebar"], [class*="Sidebar"], [class*="header"], [class*="Header"],
.semi-navigation {
  background-color: rgba(5, 7, 13, 0.72) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-color: rgba(30, 58, 107, 0.65) !important;
}

/* 选中高亮与青色发光 */
[class*="active"], [aria-selected="true"], .semi-navigation-item-selected {
  border-left: 3px solid #39FFD1 !important;
  color: #39FFD1 !important;
}

/* 表格透明化与悬停全息蓝 */
table, .semi-table, [class*="table"], [class*="Table"] {
  background-color: transparent !important;
}
thead, tr, th {
  background-color: rgba(10, 16, 32, 0.6) !important;
  color: #8FA8CC !important;
  border-color: rgba(30, 58, 107, 0.45) !important;
}
tbody tr, td, .semi-table-row {
  background-color: transparent !important;
  border-color: rgba(30, 58, 107, 0.35) !important;
  color: #E8F1FF !important;
}
tbody tr:hover, .semi-table-row:hover {
  background-color: rgba(20, 40, 71, 0.5) !important;
}

/* 按钮与交互徽章 */
button, .semi-button {
  backdrop-filter: blur(8px) !important;
}
button[class*="primary"], .semi-button-primary {
  background-color: #3A7BFF !important;
  border-color: #3A7BFF !important;
  color: #FFFFFF !important;
  box-shadow: 0 0 15px rgba(58, 123, 255, 0.4) !important;
}
button[class*="primary"]:hover, .semi-button-primary:hover {
  background-color: #528BFF !important;
  border-color: #39FFD1 !important;
  box-shadow: 0 0 20px rgba(57, 255, 209, 0.6) !important;
}

/* 输入框与选择器 */
input, textarea, select, .semi-input, [class*="input"], [class*="Input"], [class*="select"] {
  background-color: rgba(14, 25, 48, 0.75) !important;
  border: 1px solid rgba(58, 123, 255, 0.4) !important;
  color: #E8F1FF !important;
  backdrop-filter: blur(8px) !important;
}
input:focus, textarea:focus, select:focus, .semi-input:focus {
  border-color: #39FFD1 !important;
  box-shadow: 0 0 12px rgba(57, 255, 209, 0.4) !important;
}

/* 下拉菜单与弹窗浮层 */
[role="menu"], [role="listbox"], .semi-dropdown-menu, .semi-popover-content {
  background-color: rgba(10, 16, 32, 0.88) !important;
  backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(57, 255, 209, 0.3) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6) !important;
}

/* 滚动条 */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: rgba(5, 7, 13, 0.5);
}
::-webkit-scrollbar-thumb {
  background: rgba(58, 123, 255, 0.5);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: #39FFD1;
}

/* ── UI 隐藏纯净壁纸模式与 HUD 提示 ── */
body > *:not(#whale-bg-container):not(#whale-hud-toast) {
  transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1), transform 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

body.whale-ui-hidden {
  overflow: hidden !important;
}

body.whale-ui-hidden > *:not(#whale-bg-container):not(#whale-hud-toast) {
  opacity: 0 !important;
  pointer-events: none !important;
  user-select: none !important;
  transform: scale(0.99);
}

#whale-hud-toast {
  position: fixed;
  top: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(-12px);
  padding: 8px 20px;
  background: rgba(10, 16, 32, 0.88);
  border: 1px solid rgba(57, 255, 209, 0.5);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6), 0 0 16px rgba(57, 255, 209, 0.3);
  border-radius: 30px;
  color: #39FFD1;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.5px;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  z-index: 999999;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

#whale-hud-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}