/* =========================================
   设计令牌 - 基于 PhasWer 主站
   ========================================= */
:root {
  /* 颜色系统 - 深色主题 */
  --bg-dock: rgba(255, 255, 255, 0.4);
  --bg-card: rgba(255, 255, 255, 0.35);
  --bg-button: rgba(255, 255, 255, 0.4);
  --bg-gallery: rgba(255, 255, 255, 0.4);
  --bg-hover: rgba(0, 0, 0, 0.05);
  --bg-active: rgba(0, 0, 0, 0.1);
  --bg-main: rgba(255, 255, 255, 0.25);

  /* 边框 */
  --border-glass: 2px solid rgba(255, 255, 255, 0.3);
  --border-light: 2px solid rgba(255, 255, 255, 0.5);

  /* 阴影 */
  --shadow-sm: 0 5px 10px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 10px 20px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.1);
  --shadow-xxl: 0 20px 40px rgba(0, 0, 0, 0.1);
  --shadow-inset: inset 0 4px 10px rgba(0, 0, 0, 0.1);

  /* 圆角 */
  --radius-sm: 20px;
  --radius-md: 30px;
  --radius-lg: 40px;
  --radius-xl: 60px;
  --radius-max: 80px;
  --radius-pill: 9999px;

  /* 动画时长 */
  --time-fast: 0.15s;
  --time-normal: 0.3s;
  --time-slow: 0.8s;

  /* 文字颜色 */
  --text-primary: #333;
  --text-secondary: #666;

  /* 主题色 - PhasWer 品牌色 */
  --color-org: #00b351;
  --color-gld: #64acff;
  --color-ldc: #ffcc66;

  /* 布局 */
  --header-height: 80px;
  --content-max-width: 1200px;

  /* 动画曲线 */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-in: cubic-bezier(0, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.4, 0, 1, 1);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* 模糊与饱和度 */
  --backdrop-blur: blur(8px);
  --backdrop-saturate: saturate(150%);
}

/* 深色主题 */
[data-theme="dark"] {
  --bg-dock: rgba(0, 0, 0, 0.4);
  --bg-card: rgba(0, 0, 0, 0.35);
  --bg-button: rgba(0, 0, 0, 0.4);
  --bg-gallery: rgba(0, 0, 0, 0.4);
  --bg-hover: rgba(255, 255, 255, 0.05);
  --bg-active: rgba(255, 255, 255, 0.1);
  --bg-main: rgba(0, 0, 0, 0.25);

  --border-glass: 2px solid rgba(255, 255, 255, 0.3);
  --border-light: 2px solid rgba(255, 255, 255, 0.5);

  --text-primary: #e0e0e0;
  --text-secondary: #a0a0a0;

  --shadow-sm: 0 5px 10px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 10px 20px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.3);
  --shadow-xxl: 0 20px 40px rgba(0, 0, 0, 0.3);
  --shadow-inset: inset 0 4px 10px rgba(0, 0, 0, 0.3);
}

/* =========================================
   基础重置
   ========================================= */
* {
  box-sizing: border-box;
}

html {
  font-size: 16px;
}

body {
  margin: 0;
  padding: 0;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", "Helvetica Neue", Arial, sans-serif;
  background: linear-gradient(135deg, #D3E7FF 0%, #EAE2FF 100%);
  background-attachment: fixed;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background var(--time-normal) ease;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  border: none;
  background: none;
  font-family: inherit;
  cursor: pointer;
  outline: none;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}