@charset "utf-8";
/**
 * base.css —— 重置 + 跨浏览器兜底
 * 不使用 CSS 变量 / Grid / gap / object-fit，全部手写前缀。
 */

html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, em, img, small, strong, sub, sup, b, i,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, footer, header,
menu, nav, section, summary, audio, video, input, textarea, button, select {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/**
 * 全局 border-box。
 * 不加这条，元素的 border 和 padding 会额外撑宽盒子，
 * 一排等宽卡片只要带边框就会超出容器折行，而且 rem 缩放后更难排查。
 * IE9+ 全支持。
 */
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* IE9 不认识 HTML5 标签的默认 display */
article, aside, details, figcaption, figure, footer,
header, menu, nav, section, main {
  display: block;
}

ol, ul { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; }

html {
  /* font-size 由 js/rem.js 动态写入，这里只是 JS 未执行时的兜底 */
  font-size: 100px;
  height: 100%;
  /* iOS 横屏时 Safari 会自作主张放大字号，必须关掉 */
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
  /* 去掉 iOS 点击时的灰色高亮块 */
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body {
  height: 100%;
  overflow: hidden;
  /**
   * 必须显式给基准字号。
   * html 的 font-size 是 rem 基准（约 100px），body 不设值就会把它继承下来，
   * 于是每个没写 font-size 的元素都成了 80 多像素的字体。
   * 这些元素自身可能没有可见文字，但它们撑出的行盒基线（strut）会把
   * 同一行里的其他内容整体顶偏，表现为「明明写了 line-height 却不居中」。
   */
  font-size: 0.16rem;
  background: #05080f;
  color: #fff;
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  /* 整屏站禁止选中，防止拖拽时选出一片蓝 */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /**
   * 关掉双击缩放。
   * 注意不能写 touch-action:none —— touch-action 会向下收敛，
   * 祖先写了 none，后代即使写 pan-y 也滚不动，内部列表会直接失效。
   * 页面回弹由 fullpage.js 的 touchmove preventDefault 负责。
   */
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  /* 现代浏览器阻止下拉刷新/边缘回弹，iOS 16+ 才支持，老版本靠 JS 兜底 */
  overscroll-behavior: none;
}

a {
  color: inherit;
  text-decoration: none;
  outline: none;
  /* 去掉移动端点击的 300ms 延迟 */
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}

img {
  display: block;
  border: none;
  -ms-interpolation-mode: bicubic; /* IE 缩放图片不糊 */
}

input, textarea, button, select {
  font-family: inherit;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
}

button { cursor: pointer; background: none; }

/* ---------------------------------------------------------------
 * 工具类
 * --------------------------------------------------------------- */

.hide { display: none !important; }

.clearfix:after {
  content: "";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

/**
 * object-fit: cover 的替代方案。
 * Safari < 10、IE 全系、Android 4.x 都不支持 object-fit，
 * 用「绝对居中 + min-width/min-height」可以在 IE9+ 全部生效。
 */
.cover-media,
.cover-media {
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  height: auto;
  min-width: 100%;
  min-height: 100%;
  max-width: none;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

/* 视频被系统拦截时（iOS 低电量模式），把 poster 静态图顶上来 */
.media-blocked video { visibility: hidden; }
.media-blocked .media-poster { display: block; }
.media-poster { display: none; }

/**
 * 小于 12px 的文字用这个类。
 * Chrome / 360 的「最小字号」设置会把 font-size 强行抬到 12px，
 * 在 rem 缩放体系里会撑破布局。用 transform 缩放绕开限制。
 */
.text-scale-90 {
  -webkit-transform: scale(0.9);
  -ms-transform: scale(0.9);
  transform: scale(0.9);
  -webkit-transform-origin: left center;
  -ms-transform-origin: left center;
  transform-origin: left center;
}

/* 开启硬件加速的通用类，配合 will-change 的降级写法 */
.gpu {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-perspective: 1000;
  perspective: 1000;
}