/* base: 字体引入 + reset + 排版 class。
   Space Grotesk 作为专有 display sans 的开源替代（DESIGN.md §Note on Font Substitutes 指定），
   行高按文档要求在替代时下调 0.05。Rubik 承担所有 UI 文本，Monaco 走系统字体。 */
@import url("https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap");

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* 隐藏所有元素的滚动条（含任何嵌套滚动容器），滚动功能保留 */
* {
  scrollbar-width: none;  /* Firefox */
  -ms-overflow-style: none;  /* IE/Edge */
}
*::-webkit-scrollbar {
  display: none;  /* Chrome/Safari/Opera */
}

::selection {
  color: var(--ink-deep);
  background: rgba(194, 239, 78, 0.86);
}

::-moz-selection {
  color: var(--ink-deep);
  background: rgba(194, 239, 78, 0.86);
}

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  background-color: var(--surface-canvas-dark);  /* 壁纸加载前打底 */
  overflow-x: hidden;  /* 防横向滚动 */
  overscroll-behavior-y: none;
  /* 隐藏滚动条（标准模式下视口滚动条挂在 html 上） */
  scrollbar-width: none;  /* Firefox */
  -ms-overflow-style: none;  /* IE/Edge */
}
html::-webkit-scrollbar {
  display: none;  /* Chrome/Safari/Opera */
}

body {
  font-family: var(--font-ui);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--on-primary);
  background-color: transparent;  /* 透出全屏壁纸 */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;  /* 防横向滚动 */
  overscroll-behavior-y: none;
  scrollbar-width: none;  /* Firefox */
  -ms-overflow-style: none;  /* IE/Edge */
}
body::-webkit-scrollbar {
  display: none;  /* Chrome/Safari/Opera */
}

img,
svg {
  display: block;
  max-width: 100%;
}

ul {
  list-style: none;
}

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

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

/* ===== Typography classes (DESIGN.md §Typography hierarchy) =====
   display 行高在替代字体下 -0.05。 */
.text-display-hero {
  font-family: var(--font-display);
  font-size: 88px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0;
}
.text-display-large {
  font-family: var(--font-display);
  font-size: 60px;
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: 0;
}
.text-heading-xl {
  font-family: var(--font-ui);
  font-size: 30px;
  font-weight: 500;
  line-height: 1.2;
}
.text-heading-lg {
  font-family: var(--font-ui);
  font-size: 27px;
  font-weight: 500;
  line-height: 1.25;
}
.text-heading-md {
  font-family: var(--font-ui);
  font-size: 24px;
  font-weight: 500;
  line-height: 1.25;
}
.text-heading-sm {
  font-family: var(--font-ui);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.25;
}
.text-body-lg {
  font-family: var(--font-ui);
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
}
.text-body-strong {
  font-family: var(--font-ui);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
}
.text-body-md {
  font-family: var(--font-ui);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
}
.text-eyebrow {
  font-family: var(--font-ui);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;
  text-transform: uppercase;
}
.text-button-cap {
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.14;
  letter-spacing: 0.2px;
  text-transform: uppercase;
}
.text-button-cap-light {
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.29;
  letter-spacing: 0.2px;
  text-transform: uppercase;
}
.text-caption {
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.43;
}
.text-micro-cap {
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 600;
  line-height: 1.8;
  letter-spacing: 0.25px;
  text-transform: uppercase;
}
.text-code {
  font-family: var(--font-code);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
}
.text-code-strong {
  font-family: var(--font-code);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
}

/* Page scroll owner: keep wheel/touch scrolling on one predictable root. */
html {
  height: 100%;
  overflow: hidden;
}

body {
  min-height: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  overflow-anchor: none;
}