/* ==========================================================================
   FlyBit 机场 · 128fb（全新版式） 外置样式表，零内联
   A 令牌  B 基础  C 顶栏  D 侧栏与内容框架  E 按钮  F 组件  G 首页  H 表格
   I 手风琴  J 评价与画廊  K 页脚  L 响应式  M 无障碍
   ========================================================================== */

/* ---------- A. 令牌 ---------- */
:root {
  --bg: #f6f7fc;
  --bg-2: #eceffa;
  --surface: #ffffff;
  --surface-2: #f9fafd;
  --ink: #0d1425;
  --ink-2: #37415c;
  --muted: #6b7690;
  --muted-2: #9aa4bb;
  --line: #dfe4f1;
  --line-2: #edf0f8;

  --indigo: #4f46e5;
  --indigo-2: #4338ca;
  --indigo-soft: #eef0ff;
  --cyan: #0891b2;
  --cyan-soft: #e6f7fb;
  --amber: #b45309;
  --amber-soft: #fff8ec;
  --green: #0f766e;
  --green-soft: #ecfdf7;
  --rose: #be123c;

  /* 字号阶梯（与 126fb 不同：更紧的标题行高、更大的字重对比） */
  --t-xs: .76rem;
  --t-sm: .86rem;
  --t-md: .95rem;
  --t-base: 1rem;
  --t-lg: 1.08rem;
  --t-xl: clamp(1.2rem, 1.9vw, 1.42rem);
  --t-2xl: clamp(1.5rem, 2.8vw, 2.05rem);
  --t-3xl: clamp(1.85rem, 4vw, 2.7rem);
  --t-4xl: clamp(2.1rem, 5vw, 3.35rem);

  --lh-tight: 1.18;
  --lh-snug: 1.4;
  --lh-body: 1.72;
  --tr-tight: -.022em;

  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px; --s5: 20px;
  --s6: 24px; --s7: 28px; --s8: 32px; --s10: 40px; --s12: 48px; --s16: 64px; --s20: 80px;

  --r-xs: 5px; --r-sm: 8px; --r: 12px; --r-lg: 18px; --r-xl: 26px;
  --sh-1: 0 1px 2px rgba(13, 20, 37, .06);
  --sh-2: 0 6px 18px rgba(13, 20, 37, .07);
  --sh-3: 0 18px 42px rgba(13, 20, 37, .12);
  --bar-h: 58px;
  --wrap: 1180px;
  --font: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --ease: cubic-bezier(.32, .72, 0, 1);
}

html.dark {
  --bg: #070b14;
  --bg-2: #0c1120;
  --surface: #101728;
  --surface-2: #131b2e;
  --ink: #eaeefb;
  --ink-2: #c3ccdf;
  --muted: #8b96ad;
  --muted-2: #6a7590;
  --line: #1e2740;
  --line-2: #182034;
  --indigo: #a5b4fc;
  --indigo-2: #c7d2fe;
  --indigo-soft: #1a1c3a;
  --cyan: #67e8f9;
  --cyan-soft: #0d2733;
  --amber: #fbbf24;
  --amber-soft: #2a2113;
  --green: #5eead4;
  --green-soft: #0d2a26;
  --rose: #fb7185;
  --sh-1: 0 1px 2px rgba(0, 0, 0, .55);
  --sh-2: 0 6px 18px rgba(0, 0, 0, .55);
  --sh-3: 0 18px 42px rgba(0, 0, 0, .6);
}

/* ---------- B. 基础 ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--bar-h) + 16px); }
body {
  margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font);
  font-size: var(--t-base); line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased; overflow-wrap: break-word;
}
img, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: var(--indigo); text-decoration: none; transition: color .16s var(--ease); }
a:hover { color: var(--cyan); }
strong, b { color: var(--ink); font-weight: 700; }
small { font-size: var(--t-xs); }
h1, h2, h3, h4, h5 {
  margin: 0 0 var(--s3); color: var(--ink); font-weight: 750;
  line-height: var(--lh-tight); letter-spacing: var(--tr-tight); text-wrap: balance;
}
h1 { font-size: var(--t-2xl); }
h2 { font-size: var(--t-xl); }
h3 { font-size: var(--t-lg); font-weight: 700; }
h4 { font-size: var(--t-md); font-weight: 700; }
p { margin: 0 0 var(--s4); color: var(--ink-2); }
p:last-child, ul:last-child, ol:last-child { margin-bottom: 0; }
ul, ol { margin: 0 0 var(--s4); padding-left: 1.2em; }
li { margin: var(--s2) 0; color: var(--ink-2); }
li::marker { color: var(--indigo); font-weight: 700; }
code, kbd { font-family: var(--mono); font-size: .88em; }
code { background: var(--indigo-soft); color: var(--indigo-2); padding: .1em .42em; border-radius: var(--r-xs); }
html.dark code { color: var(--indigo); }
kbd { background: var(--surface); border: 1px solid var(--line); border-bottom-width: 2px; border-radius: var(--r-xs); padding: .08em .42em; color: var(--ink-2); }
hr { border: 0; border-top: 1px solid var(--line); margin: var(--s8) 0; }
::selection { background: rgba(79, 70, 229, .2); }

.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 clamp(16px, 3.2vw, 26px); }
.skip { position: absolute; left: -9999px; top: 0; }
.skip:focus { left: var(--s4); top: var(--s4); z-index: 90; background: var(--surface); padding: var(--s2) var(--s4); border-radius: var(--r-sm); box-shadow: var(--sh-2); }

/* ---------- C. 顶栏 ---------- */
.bar { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, .88); backdrop-filter: blur(14px) saturate(150%); border-bottom: 1px solid var(--line); }
html.dark .bar { background: rgba(7, 11, 20, .9); }
.bar__in { display: flex; align-items: center; gap: var(--s4); min-height: var(--bar-h); }
.logo { display: flex; align-items: center; gap: var(--s2); flex-shrink: 0; }
.logo img { width: 30px; height: 30px; border-radius: 9px; box-shadow: var(--sh-1); }
.logo b { font-size: 1.05rem; font-weight: 800; letter-spacing: -.02em; color: var(--ink); }
.logo span { font-size: .62rem; font-weight: 700; letter-spacing: .16em; color: var(--muted-2); display: block; line-height: 1.1; }
.logo:hover b { color: var(--indigo); }

.menu { display: none; align-items: center; gap: 2px; margin-left: auto; }
.menu a { padding: var(--s2) var(--s3); border-radius: 999px; font-size: var(--t-sm); font-weight: 600; color: var(--ink-2); white-space: nowrap; }
.menu a:hover { background: var(--indigo-soft); color: var(--indigo); }
.menu a.on { background: var(--indigo); color: #fff; }
html.dark .menu a.on { color: #0b1120; }
.menu .has-sub { position: relative; }
.menu .has-sub > a i { font-size: .58rem; margin-left: 5px; color: var(--muted-2); }
.sub { position: absolute; top: calc(100% + 8px); right: 0; min-width: 208px; padding: var(--s2); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--sh-3); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: .2s var(--ease); }
.menu .has-sub:hover .sub, .menu .has-sub:focus-within .sub { opacity: 1; visibility: visible; transform: none; }
.sub a { display: flex; align-items: center; gap: var(--s2); padding: var(--s2) var(--s3); border-radius: var(--r-xs); font-size: var(--t-sm); font-weight: 500; }
.sub a i { width: 14px; color: var(--muted-2); font-size: .8rem; }
.sub a:hover i { color: var(--indigo); }

.bar__tools { display: flex; align-items: center; gap: var(--s2); }
.bar__cta { display: none; }
.ico-btn { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); cursor: pointer; font-size: .9rem; transition: .16s var(--ease); }
.ico-btn:hover { border-color: var(--indigo); color: var(--indigo); }
@media (min-width: 1040px) {
  .menu { display: flex; }
  .bar__tools { margin-left: var(--s2); }
  .hamb { display: none; }
}
@media (min-width: 1240px) { .bar__cta { display: inline-flex; } }

.drawer { display: none; border-top: 1px solid var(--line); background: var(--surface); max-height: calc(100dvh - var(--bar-h)); overflow-y: auto; }
.drawer.open { display: block; }
.drawer__list { list-style: none; margin: 0; padding: var(--s2) clamp(16px, 3.2vw, 26px) var(--s5); }
.drawer__list > li { margin: 0; border-bottom: 1px solid var(--line-2); }
.drawer__list > li:last-child { border-bottom: 0; }
.drawer__list a { display: block; padding: var(--s3) 0; font-size: var(--t-md); font-weight: 600; color: var(--ink-2); }
.drawer__list a.on { color: var(--indigo); }
.drawer__group > summary { display: flex; align-items: center; justify-content: space-between; padding: var(--s3) 0; cursor: pointer; font-size: var(--t-md); font-weight: 600; color: var(--ink-2); list-style: none; }
.drawer__group > summary::-webkit-details-marker { display: none; }
.drawer__group > summary i { font-size: .68rem; color: var(--muted-2); transition: transform .2s var(--ease); }
.drawer__group[open] > summary { color: var(--indigo); }
.drawer__group[open] > summary i { transform: rotate(45deg); }
.drawer__group ul { list-style: none; padding: 0 0 var(--s2) var(--s4); margin: 0; }
.drawer__group a { padding: var(--s2) 0; font-size: var(--t-sm); font-weight: 500; color: var(--muted); }
.drawer__cta { padding: 0 clamp(16px, 3.2vw, 26px) var(--s5); }

/* ---------- D. 侧栏 + 内容框架 ---------- */
.shell { display: grid; gap: var(--s10); padding: var(--s8) 0 var(--s16); }
.shell > * { min-width: 0; }
.doc { max-width: 74ch; }
.aside { display: none; }
@media (min-width: 1020px) {
  .shell { grid-template-columns: 258px minmax(0, 1fr); }
  .aside { display: block; }
}
.aside__box { position: sticky; top: calc(var(--bar-h) + var(--s5)); }
.aside__card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--s5); box-shadow: var(--sh-1); }
.aside__title { font-size: var(--t-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--muted-2); margin: 0 0 var(--s3); }
.aside__nav { list-style: none; margin: 0 0 var(--s4); padding: 0; }
.aside__nav li { margin: 0; }
.aside__nav a { display: block; padding: 6px 0 6px var(--s3); border-left: 2px solid var(--line); font-size: var(--t-sm); color: var(--muted); }
.aside__nav a:hover { color: var(--indigo); border-color: var(--indigo); }
.aside__nav a.on { color: var(--indigo); border-color: var(--indigo); font-weight: 700; }
.aside__prog { height: 4px; border-radius: 999px; background: var(--line-2); overflow: hidden; }
.aside__prog i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--indigo), var(--cyan)); transition: width .18s var(--ease); }
.aside__meta { margin-top: var(--s3); font-size: var(--t-xs); color: var(--muted-2); }
.aside__cta { margin-top: var(--s4); }

.head { padding: calc(var(--s8) + 2px) 0 var(--s10); border-bottom: 1px solid var(--line-2); }
.head__tag { display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px; border-radius: 999px; background: var(--indigo-soft); color: var(--indigo-2); font-size: var(--t-xs); font-weight: 700; margin-bottom: var(--s4); }
html.dark .head__tag { color: var(--indigo); }
.head h1 { margin-bottom: var(--s3); }
.head__sub { font-size: var(--t-lg); color: var(--muted); max-width: 70ch; margin: 0; }
.crumb { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2); font-size: var(--t-xs); color: var(--muted-2); margin-bottom: var(--s4); }
.crumb a { color: var(--muted); text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 3px; }
.crumb a:hover { color: var(--indigo); }
.crumb i { font-size: .58rem; }

/* ---------- E. 按钮 ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--s2); padding: 12px var(--s5); border-radius: var(--r); border: 1px solid transparent; font-family: inherit; font-size: var(--t-sm); font-weight: 700; line-height: 1.2; cursor: pointer; white-space: nowrap; transition: .18s var(--ease); }
.btn i { font-size: .92em; }
.btn--solid { background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-2) 100%); color: #fff; box-shadow: 0 12px 26px rgba(79, 70, 229, .28); }
html.dark .btn--solid { color: #0b1120; box-shadow: none; }
.btn--solid:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 16px 32px rgba(79, 70, 229, .34); }
html.dark .btn--solid:hover { color: #0b1120; }
.btn--line { background: var(--surface); border-color: var(--line); color: var(--ink); }
.btn--line:hover { border-color: var(--indigo); color: var(--indigo); }
.btn--sm { padding: 8px var(--s4); font-size: var(--t-xs); }
.btn--wide { width: 100%; }
.btn--on-dark { background: rgba(255, 255, 255, .14); color: #fff; border-color: rgba(255, 255, 255, .26); backdrop-filter: blur(4px); }
.btn--on-dark:hover { background: rgba(255, 255, 255, .24); color: #fff; }
.btn:active { transform: translateY(0); }

/* ---------- F. 组件 ---------- */
.sect { padding: var(--s16) 0; }
.sect--soft { background: var(--surface); border-top: 1px solid var(--line-2); border-bottom: 1px solid var(--line-2); }
.sechead { max-width: 720px; margin: 0 auto var(--s8); text-align: center; }
.sechead h2 { margin-bottom: var(--s2); }
.sechead p { color: var(--muted); margin: 0; }
.kk { display: inline-flex; align-items: center; gap: var(--s2); font-size: var(--t-xs); font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--indigo); margin-bottom: var(--s3); }

.stack { display: flex; flex-direction: column; gap: var(--s6); }
.stack > * { margin-top: 0; margin-bottom: 0; }
.stack > .callout, .stack > .sechead, .stack > .acc, .stack > .tl, .stack > .stepper { margin-top: 0; margin-bottom: 0; }
.stack > h2:not(:first-child), .stack > h3:not(:first-child), .stack > .sechead:not(:first-child) { margin-top: var(--s8); }

.chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border-radius: 999px; font-size: var(--t-xs); font-weight: 700; background: var(--indigo-soft); color: var(--indigo-2); border: 1px solid transparent; }
html.dark .chip { color: var(--indigo); }
.chip--line { background: transparent; border-color: var(--line); color: var(--muted); }

.bento { display: grid; gap: var(--s5); }
.bento > * { min-width: 0; }
@media (min-width: 700px) { .bento { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1040px) { .bento { grid-template-columns: repeat(6, minmax(0, 1fr)); } .bento .sm3 { grid-column: span 3; } .bento .sm2 { grid-column: span 2; } }

.tile { position: relative; height: 100%; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--s6); box-shadow: var(--sh-1); transition: .2s var(--ease); }
.tile::before { content: ""; position: absolute; left: 0; top: var(--s6); bottom: var(--s6); width: 3px; border-radius: 0 3px 3px 0; background: linear-gradient(180deg, var(--indigo), var(--cyan)); opacity: .0; transition: opacity .2s var(--ease); }
.tile:hover::before { opacity: 1; }
.tile--link:hover { transform: translateY(-3px); box-shadow: var(--sh-3); border-color: rgba(79, 70, 229, .3); }
.tile h3 { margin-bottom: var(--s2); }
.tile p { font-size: var(--t-sm); color: var(--muted); margin: 0; }
html.dark .tile__ico { font-size: 1.15rem; color: var(--indigo); margin-bottom: var(--s3); }
.tile__more { display: inline-flex; align-items: center; gap: 6px; margin-top: var(--s3); font-size: var(--t-xs); font-weight: 700; color: var(--indigo); }

.metric { display: grid; gap: var(--s4); grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 900px) { .metric { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.metric div { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: var(--s4) var(--s5); }
.metric strong { display: block; font-size: 1.45rem; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; letter-spacing: -.02em; line-height: 1.15; }
.metric span { font-size: var(--t-xs); color: var(--muted); }

.callout { display: flex; gap: var(--s3); padding: var(--s4) var(--s5); border-radius: var(--r); border: 1px solid var(--line); background: var(--surface); font-size: var(--t-sm); margin: var(--s5) 0; }
.callout i { color: var(--indigo); font-size: 1rem; margin-top: .18em; }
.callout p { margin: 0; font-size: var(--t-sm); }
.callout--tip { border-color: rgba(15, 118, 110, .3); background: var(--green-soft); }
.callout--tip i { color: var(--green); }
.callout--warn { border-color: rgba(180, 83, 9, .3); background: var(--amber-soft); }
.callout--warn i { color: var(--amber); }
.callout strong { color: var(--ink); }

.stepper { display: grid; gap: var(--s5); counter-reset: st; list-style: none; margin: 0; padding: 0; }
.stepper > li { position: relative; padding-left: var(--s10); margin: 0; counter-increment: st; }
.stepper > li::before { content: counter(st, decimal-leading-zero); position: absolute; left: 0; top: 0; width: 30px; height: 30px; border-radius: 9px; background: var(--ink); color: #fff; font-family: var(--mono); font-size: .78rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }
html.dark .stepper > li::before { background: var(--indigo-soft); color: var(--indigo); }
.stepper > li::after { content: ""; position: absolute; left: 14px; top: 34px; bottom: -6px; border-left: 1px dashed var(--line); }
.stepper > li:last-child::after { display: none; }
.stepper h3 { margin-bottom: var(--s1); }
.stepper p { font-size: var(--t-sm); color: var(--muted); margin: 0; }
@media (min-width: 900px) {
  .stepper--row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s6); }
  .stepper--row > li { padding-left: 0; padding-top: var(--s10); }
  .stepper--row > li::before { top: 0; }
  .stepper--row > li::after { left: 34px; right: -14px; top: 14px; bottom: auto; border-left: 0; border-top: 1px dashed var(--line); }
}

.tl { list-style: none; margin: 0; padding: 0; }
.tl > li { position: relative; margin: 0; padding: 0 0 var(--s5) var(--s6); border-left: 1px solid var(--line); }
.tl > li:last-child { padding-bottom: 0; }
.tl > li::before { content: ""; position: absolute; left: -5px; top: 6px; width: 9px; height: 9px; border-radius: 2px; background: var(--indigo); }
.tl strong { display: block; color: var(--ink); font-variant-numeric: tabular-nums; }
.tl p { margin: var(--s1) 0 0; font-size: var(--t-sm); color: var(--muted); }

.chips { display: flex; flex-wrap: wrap; gap: var(--s3); list-style: none; margin: 0; padding: 0; }
.chips li { margin: 0; }

.links-list { display: grid; gap: var(--s3); }
.links-list a { display: flex; align-items: center; gap: var(--s3); padding: var(--s4) var(--s5); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); font-size: var(--t-sm); font-weight: 600; color: var(--ink); transition: .18s var(--ease); }
.links-list a i:first-child { color: var(--indigo); }
.links-list a i:last-child { margin-left: auto; color: var(--muted-2); font-size: .8rem; }
.links-list a:hover { border-color: rgba(79, 70, 229, .35); transform: translateX(3px); color: var(--ink); }
.links-list span { display: block; font-size: var(--t-xs); font-weight: 500; color: var(--muted); }

.pager { display: grid; gap: var(--s4); margin-top: var(--s12); }
@media (min-width: 700px) { .pager { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pager a { display: block; padding: var(--s5); border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); transition: .18s var(--ease); }
.pager a:hover { border-color: rgba(79, 70, 229, .35); box-shadow: var(--sh-2); }
.pager span { display: block; font-size: var(--t-xs); color: var(--muted-2); margin-bottom: 4px; }
.pager strong { font-size: var(--t-md); color: var(--ink); }
.pager .next { text-align: right; }

.cta { position: relative; overflow: hidden; border-radius: var(--r-xl); padding: var(--s12) var(--s8); background: #0d1425; color: #fff; text-align: center; }
.cta::after { content: ""; position: absolute; inset: 0; background: radial-gradient(600px 240px at 50% -30%, rgba(79, 70, 229, .5), transparent 70%); pointer-events: none; }
.cta h2 { color: #fff; position: relative; }
.cta p { color: rgba(255, 255, 255, .78); max-width: 620px; margin: 0 auto var(--s5); position: relative; }
.cta__row { display: flex; flex-wrap: wrap; gap: var(--s3); justify-content: center; position: relative; }

/* ---------- G. 首页 ---------- */
.hero { position: relative; overflow: hidden; background: linear-gradient(150deg, #0b1020 0%, #1b1f45 52%, #0d1425 100%); color: #fff; padding: var(--s16) 0 var(--s12); }
.hero__grid { position: absolute; inset: 0; opacity: .45; background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px); background-size: 52px 52px; }
.hero__in { position: relative; display: grid; gap: var(--s10); align-items: center; }
.hero h1 { font-size: var(--t-4xl); color: #fff; margin-bottom: var(--s4); }
.hero h1 em { font-style: normal; background: linear-gradient(90deg, #a5b4fc, #67e8f9); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero__lead { color: rgba(255, 255, 255, .8); font-size: var(--t-lg); max-width: 58ch; }
.hero__row { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: var(--s5); }
.hero__note { display: flex; flex-wrap: wrap; gap: var(--s3) var(--s5); margin-top: var(--s6); padding-top: var(--s5); border-top: 1px solid rgba(255, 255, 255, .14); font-size: var(--t-xs); color: rgba(255, 255, 255, .66); }
.hero__note span { display: inline-flex; align-items: center; gap: 7px; }
.hero__note i { color: #67e8f9; }
.hero__panel { position: relative; }
.panel { background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .16); border-radius: var(--r-lg); padding: var(--s4); backdrop-filter: blur(8px); box-shadow: 0 30px 70px rgba(3, 6, 18, .5); }
.panel__bar { display: flex; align-items: center; gap: 6px; padding-bottom: var(--s3); border-bottom: 1px solid rgba(255, 255, 255, .12); margin-bottom: var(--s3); }
.panel__bar i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255, 255, 255, .22); }
.panel__bar em { margin-left: auto; font-style: normal; font-size: var(--t-xs); color: rgba(255, 255, 255, .55); font-family: var(--mono); }
.panel__list { list-style: none; margin: 0; padding: 0; }
.panel__list li { display: flex; align-items: center; gap: var(--s3); margin: 0; padding: var(--s2) 0; font-size: var(--t-sm); color: rgba(255, 255, 255, .82); }
.panel__list i { color: #67e8f9; }
.panel__list b { margin-left: auto; font-weight: 600; font-variant-numeric: tabular-nums; color: #fff; }
.panel__foot { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s3); padding-top: var(--s3); border-top: 1px solid rgba(255, 255, 255, .12); }
@media (min-width: 1020px) { .hero__in { grid-template-columns: 1.02fr .98fr; gap: var(--s12); } }

.marquee { background: #0a0f1e; color: rgba(255, 255, 255, .7); font-size: var(--t-xs); overflow: hidden; }
.marquee__in { display: flex; gap: var(--s8); padding: 9px 0; white-space: nowrap; width: max-content; animation: mq 40s linear infinite; }
.marquee__in span { display: inline-flex; align-items: center; gap: 7px; }
.marquee__in i { color: #67e8f9; }
@keyframes mq { from { transform: translateX(0); } to { transform: translateX(-50%); } }


html.dark 
/* ---------- H. 表格 ---------- */
.tablebox { border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; background: var(--surface); }
.tablebox__scroll { overflow-x: auto; }
table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: var(--t-sm); }
thead th { background: var(--surface-2); text-align: left; font-weight: 700; color: var(--ink); white-space: nowrap; font-size: var(--t-xs); letter-spacing: .02em; text-transform: uppercase; }
th, td { padding: var(--s3) var(--s4); border-bottom: 1px solid var(--line-2); color: var(--ink-2); vertical-align: top; line-height: 1.65; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:nth-child(even) td { background: color-mix(in srgb, var(--surface-2) 70%, transparent); }
td b { color: var(--ink); }

/* ---------- I. 手风琴 ---------- */
.acc { display: grid; gap: var(--s3); }
.acc details { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.acc summary { display: flex; align-items: center; gap: var(--s4); padding: var(--s4) var(--s5); cursor: pointer; font-weight: 700; color: var(--ink); list-style: none; }
.acc summary::-webkit-details-marker { display: none; }
.acc summary::after { content: "\f067"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-left: auto; color: var(--muted-2); font-size: .85rem; transition: transform .2s var(--ease), color .2s var(--ease); }
.acc details[open] summary::after { content: "\f068"; color: var(--indigo); }
.acc__body { padding: 0 var(--s5) var(--s5); font-size: var(--t-sm); }

/* ---------- J. 页脚 ---------- */
.foot { margin-top: var(--s16); background: #0a0f1e; color: #8b96ad; padding: var(--s12) 0 var(--s6); }
.foot a { color: #cbd5e1; }
.foot a:hover { color: #67e8f9; }
.foot__grid { display: grid; gap: var(--s8); grid-template-columns: 1fr; }
.foot h4 { color: #fff; font-size: var(--t-sm); margin: 0 0 var(--s3); }
.foot ul { list-style: none; margin: 0; padding: 0; }
.foot li { margin: 0 0 7px; font-size: var(--t-sm); }
.foot__brand { display: flex; align-items: center; gap: var(--s3); margin-bottom: var(--s3); }
.foot__brand img { width: 32px; height: 32px; border-radius: 9px; }
.foot__brand b { color: #fff; font-size: 1.02rem; font-weight: 800; }
.foot__about p { font-size: var(--t-sm); line-height: 1.75; color: #8b96ad; }
.foot__chips { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s3); }
.foot__chips span { font-size: var(--t-xs); color: #6f7f96; border: 1px solid #26324b; border-radius: 999px; padding: 3px 10px; }
.foot__seo { margin-top: var(--s10); padding-top: var(--s5); border-top: 1px solid #1b2438; font-size: var(--t-xs); line-height: 1.9; color: #66748d; }
.foot__bottom { display: flex; flex-wrap: wrap; gap: var(--s3); justify-content: space-between; margin-top: var(--s4); padding-top: var(--s4); border-top: 1px solid #1b2438; font-size: var(--t-xs); color: #66748d; }
@media (min-width: 620px) { .foot__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .foot__grid { grid-template-columns: 1.7fr repeat(4, minmax(0, 1fr)); } }

.top { position: fixed; right: var(--s5); bottom: var(--s5); z-index: 60; width: 44px; height: 44px; border-radius: 50%; border: 0; cursor: pointer; background: var(--indigo); color: #fff; box-shadow: var(--sh-3); display: flex; align-items: center; justify-content: center; opacity: 0; transform: translateY(10px); pointer-events: none; transition: .2s var(--ease); }
html.dark .top { color: #0b1120; }
.top.on { opacity: 1; transform: none; pointer-events: auto; }
.top:hover { background: var(--cyan); color: #fff; }

/* ---------- L. 响应式 ---------- */
@media (max-width: 700px) {
  :root { --bar-h: 54px; }
  .sect { padding: var(--s12) 0; }
  .hero { padding: var(--s12) 0 var(--s10); }
  .tile,   .cta { padding: var(--s8) var(--s5); border-radius: var(--r-lg); }
  .foot { margin-top: var(--s12); }
  .pager .next { text-align: left; }
}

/* ---------- M. 无障碍与偏好 ---------- */
a:focus-visible, button:focus-visible, summary:focus-visible, .btn:focus-visible {
  outline: 2px solid var(--cyan); outline-offset: 2px; border-radius: var(--r-xs);
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .marquee__in { animation: none; }
  .btn, .tile, .links-list a, .top { transition: none; }
  .btn:hover, .tile--link:hover, .links-list a:hover { transform: none; }
}
@media print {
  .bar, .top, .marquee, .aside, .foot__seo, .pager { display: none; }
  body { background: #fff; }
  .tile, .tablebox { box-shadow: none; }
}
