/* MEILI AI v3 · base —— 字体、重置、排版、焦点、工具类 */
@font-face {
  font-family: "Bricolage Grotesque";
  src: url("../fonts/bricolage-grotesque-latin-var.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 16px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

body {
  min-height: 100vh;
  background: var(--s0);
  color: var(--t1);
  font: 400 var(--fs-body) / var(--lh-body) var(--font-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: clip;
}

h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 600; color: var(--t1); text-wrap: balance; }
h1 { font-size: var(--fs-h1); line-height: var(--lh-display); letter-spacing: -.02em; }
h2 { font-size: var(--fs-h2); line-height: var(--lh-head); letter-spacing: -.02em; }
h3 { font-size: var(--fs-h3); line-height: 1.3; letter-spacing: -.01em; }
h4 { font-size: var(--fs-h4); line-height: 1.4; }
:lang(zh-CN) :is(h1, h2, h3, h4), :lang(ja) :is(h1, h2, h3, h4) { letter-spacing: 0; word-break: keep-all; overflow-wrap: anywhere; line-break: strict; }
p { text-wrap: pretty; }
:lang(zh-CN) body { font-feature-settings: "palt" 1; }

a { color: var(--t-accent); text-decoration: none; }
a:hover { color: var(--t1); }
img, svg, video, canvas { display: block; max-width: 100%; }
img { height: auto; }
ul, ol { list-style: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
kbd { font: 500 .85em/1 var(--font-mono); padding: .2em .45em; border-radius: var(--r-xs); background: var(--s4); border: 1px solid var(--line-2); color: var(--t1); }
table { border-collapse: collapse; width: 100%; }
address { font-style: normal; }

:focus { outline: none; }
:focus-visible { outline: 2px solid var(--focus-color); outline-offset: 3px; border-radius: 4px; }
::selection { background: rgba(56, 182, 242, .35); color: var(--t1); }

/* 工具类 */
.u-sr-only, .u-visually-hidden {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap; border: 0; padding: 0; margin: -1px;
}
.u-mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; letter-spacing: 0; }
.u-num { font-family: var(--font-display); font-variant-numeric: tabular-nums; }
.u-skip-link {
  position: fixed; left: 16px; top: -80px; z-index: var(--z-skip);
  padding: 12px 18px; border-radius: var(--r-pill);
  background: var(--g-btn); color: #fff; font: 600 var(--fs-small) / 1 var(--font-display);
  transition: top var(--d-2) var(--e-out);
}
.u-skip-link:focus, .u-skip-link:focus-visible { top: 12px; color: #fff; }

.l-container { width: min(100% - 2 * var(--gutter), var(--container)); margin-inline: auto; }
.l-wide { width: min(100% - 2 * var(--gutter), var(--container-wide)); margin-inline: auto; }

/* 入场：只有 html.js-motion 下才先隐藏；2.5 s 兜底 reveal-all；打印全部显示 */
html.js-motion:not(.reveal-all) [data-reveal]:not(.is-in) { opacity: 0; transform: translateY(18px); }
[data-reveal] { transition: opacity var(--d-4) var(--e-out), transform var(--d-4) var(--e-out); transition-delay: calc(var(--i, 0) * 70ms); }
[data-i="1"] { --i: 1; } [data-i="2"] { --i: 2; } [data-i="3"] { --i: 3; } [data-i="4"] { --i: 4; }
[data-i="5"] { --i: 5; } [data-i="6"] { --i: 6; } [data-i="7"] { --i: 7; } [data-i="8"] { --i: 8; }
@media print { [data-reveal] { opacity: 1 !important; transform: none !important; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}