/* ==========================================================================
   基础样式：重置 · 排版 · 图标 · 滚动条 · 焦点 · 动效偏好
   ========================================================================== */

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

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scrollbar-gutter: stable;
  color-scheme: light;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--font-sans);
  font-size: var(--fs-14);
  line-height: var(--lh-base);
  color: var(--c-text-1);
  background: var(--c-canvas);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-tap-highlight-color: transparent;
}

h1, h2, h3, h4, h5, h6, p, figure, blockquote { margin: 0; }
h1, h2, h3, h4 { font-weight: var(--fw-semibold); line-height: var(--lh-tight); }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
code { font-family: var(--font-num); font-size: .92em; }

button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  cursor: pointer;
  text-align: inherit;
}
button:disabled { cursor: not-allowed; }

input, textarea {
  font: inherit;
  color: inherit;
  margin: 0;
  appearance: none;
  -webkit-appearance: none;
}
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; display: none; }

[hidden] { display: none !important; }

::selection { background: rgba(255, 194, 61, .35); color: inherit; }

/* ---------- 焦点：仅键盘操作时显示 ---------- */
:focus { outline: none; }
:focus-visible { outline: var(--focus-outline); outline-offset: 2px; }

/* ---------- 图标 ---------- */
.yb-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.yb-icon {
  display: inline-block;
  flex: none;
  vertical-align: middle;
  fill: none;
  stroke: currentColor;
  stroke-width: var(--icon-stroke);
  stroke-linecap: round;
  stroke-linejoin: round;
  overflow: visible;
}

/* ---------- 滚动条 ---------- */
* { scrollbar-width: thin; scrollbar-color: var(--c-gray-300) transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background-color: var(--c-gray-300);
  border: 3px solid transparent;
  border-radius: 999px;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background-color: var(--c-gray-400); }

/* ---------- 工具类 ---------- */
.sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}
.t-num { font-family: var(--font-num); font-variant-numeric: tabular-nums; }
.t-secondary { color: var(--c-text-2); }
.t-muted { color: var(--c-text-3); }

/* ---------- 状态 ---------- */
/* 首屏渲染前禁用过渡，避免服务端直出的状态被「动画」出来 */
.is-preload *, .is-preload *::before, .is-preload *::after { transition: none !important; }
html.is-scroll-locked, html.is-scroll-locked body { overflow: hidden; }

/* 跨页面平滑切换（支持的浏览器生效，其余自动降级） */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 160ms; }

@keyframes yb-spin { to { transform: rotate(360deg); } }
@keyframes yb-shimmer { from { background-position: 150% 0; } to { background-position: -50% 0; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
