/* ============================================================
   Prism — 设计令牌
   ============================================================ */
:root {
  --brand: #3f6ae6;
  --brand-deep: #2f56cc;
  --brand-tint: rgba(63, 106, 230, .10);
  --brand-line: rgba(63, 106, 230, .30);

  --ink: #1a1f29;
  --ink-mid: rgba(22, 28, 40, .68);
  --ink-soft: rgba(22, 28, 40, .53);
  --ink-ghost: rgba(22, 28, 40, .27);
  --band-ink: rgba(22, 28, 40, .60);

  --bg: #fbfbfc;
  --sky: #b7cde9;
  --sky-glow: rgba(255, 255, 255, .60);
  --sky-fade: rgba(251, 251, 252, 0);

  --surface: rgba(255, 255, 255, .38);
  --surface-hi: rgba(255, 255, 255, .66);
  --surface-solid: #ffffff;
  --line: rgba(16, 24, 40, .08);
  --line-mid: rgba(16, 24, 40, .13);
  --line-glass: rgba(255, 255, 255, .62);

  --pill: 999px;
  --card: 26px;
  --blur: 14px;

  --shadow-card: 0 1px 2px rgba(16, 24, 40, .04), 0 16px 40px -20px rgba(16, 24, 40, .22);
  --shadow-cta: 0 1px 2px rgba(16, 24, 40, .06), 0 10px 24px -12px rgba(16, 24, 40, .30);

  --ease: cubic-bezier(.22, .9, .26, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);

  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
          "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
}

[data-theme="dark"] {
  --brand: #7b98f5;
  --brand-deep: #5f80ef;
  --brand-tint: rgba(123, 152, 245, .14);
  --brand-line: rgba(123, 152, 245, .34);

  --ink: #eef2fa;
  --ink-mid: rgba(255, 255, 255, .72);
  --ink-soft: rgba(255, 255, 255, .52);
  --ink-ghost: rgba(255, 255, 255, .26);
  --band-ink: rgba(255, 255, 255, .58);

  --bg: #0d1117;
  --sky: #1a2942;
  --sky-glow: rgba(96, 138, 200, .20);
  --sky-fade: rgba(13, 17, 23, 0);

  --surface: rgba(255, 255, 255, .055);
  --surface-hi: rgba(255, 255, 255, .11);
  --surface-solid: #161b24;
  --line: rgba(255, 255, 255, .07);
  --line-mid: rgba(255, 255, 255, .14);
  --line-glass: rgba(255, 255, 255, .10);

  --shadow-card: 0 1px 2px rgba(0, 0, 0, .3), 0 20px 50px -24px rgba(0, 0, 0, .8);
  --shadow-cta: 0 1px 2px rgba(0, 0, 0, .4), 0 12px 28px -14px rgba(0, 0, 0, .7);
}

/* ============================================================
   基础
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  min-height: 100svh;
  font-family: var(--font);
  background: var(--bg);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background-color .45s var(--ease), color .45s var(--ease);
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }
h1, h2, h3, p { margin: 0; }

::selection { background: var(--brand-tint); color: var(--ink); }

/* ============================================================
   背景光晕
   ============================================================ */
.backdrop {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background:
    radial-gradient(120% 46% at 50% -18%, var(--sky-glow), transparent 64%),
    linear-gradient(180deg, var(--sky) 0%, var(--sky-fade) 54%);
  transition: background .6s var(--ease);
  -webkit-mask-image: linear-gradient(#000 0%, rgba(0, 0, 0, .84) 22%, transparent 80%);
  mask-image: linear-gradient(#000 0%, rgba(0, 0, 0, .84) 22%, transparent 80%);
}

.aurora {
  position: absolute;
  border-radius: 50%;
  filter: blur(72px);
  will-change: transform;
  opacity: .82;
  transition: background .6s var(--ease), opacity .6s var(--ease);
}

.aurora-a {
  width: 62vw; height: 62vw; max-width: 840px; max-height: 840px;
  left: -12%; top: -34%;
  background: radial-gradient(circle at 42% 42%, #86a2d8, transparent 66%);
  animation: swirl-a 20s ease-in-out infinite alternate;
}
.aurora-b {
  width: 54vw; height: 54vw; max-width: 720px; max-height: 720px;
  right: -10%; top: -16%;
  background: radial-gradient(circle at 58% 50%, #ffffff, transparent 62%);
  animation: swirl-b 25s ease-in-out infinite alternate;
}
.aurora-c {
  width: 74vw; height: 52vw; max-width: 980px; max-height: 680px;
  left: 16%; top: 4%;
  background: radial-gradient(circle at 50% 50%, #b8cfea, transparent 68%);
  animation: swirl-c 28s ease-in-out infinite alternate;
}

[data-theme="dark"] .aurora { opacity: .38; }
[data-theme="dark"] .aurora-a { background: radial-gradient(circle at 42% 42%, #2b4a7d, transparent 66%); }
[data-theme="dark"] .aurora-b { background: radial-gradient(circle at 58% 50%, #4a6fa8, transparent 62%); }
[data-theme="dark"] .aurora-c { background: radial-gradient(circle at 50% 50%, #1f3455, transparent 68%); }

@keyframes swirl-a {
  from { transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
  to   { transform: translate3d(11%, 9%, 0) rotate(16deg) scale(1.14); }
}
@keyframes swirl-b {
  from { transform: translate3d(0, 0, 0) rotate(0deg) scale(1.1); }
  to   { transform: translate3d(-13%, 11%, 0) rotate(-22deg) scale(.94); }
}
@keyframes swirl-c {
  from { transform: translate3d(-5%, 3%, 0) scale(1); }
  to   { transform: translate3d(9%, -7%, 0) scale(1.18); }
}

/* ============================================================
   导航
   ============================================================ */
.nav-wrap {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 60;
  width: min(100% - 40px, 1120px);
  margin: 0 auto;
  padding: 10px 0 0;
}

.nav-bar {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  height: 56px;
  padding: 0 8px 0 14px;
  border-radius: var(--pill);
}

/* 滚动后才展开的玻璃胶囊 */
.nav-bar::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: var(--pill);
  background: var(--surface-hi);
  border: 1px solid transparent;
  -webkit-backdrop-filter: blur(var(--blur)) saturate(1.7);
  backdrop-filter: blur(var(--blur)) saturate(1.7);
  opacity: 0;
  transform: scaleX(.88);
  transform-origin: center;
  transition: transform .5s var(--ease), opacity .3s ease, border-color .3s ease;
}
.nav-bar.is-scrolled::before {
  opacity: 1;
  transform: scaleX(1);
  border-color: var(--line);
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 12px 30px -18px rgba(16, 24, 40, .3);
}
[data-theme="dark"] .nav-bar::before {
  background: rgba(255, 255, 255, .055);
  -webkit-backdrop-filter: blur(18px) saturate(1.4);
  backdrop-filter: blur(18px) saturate(1.4);
}
[data-theme="dark"] .nav-bar.is-scrolled::before {
  border-color: rgba(255, 255, 255, .1);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 16px 36px -20px rgba(0, 0, 0, .9);
}

/* 品牌 */
.brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  flex-shrink: 0;
}
.brand-name {
  font-size: 17px;
  font-weight: 600;
  letter-spacing: .01em;
  color: var(--ink);
}

/* LOGO 空位：一个等尺寸的虚线占位框，随时可替换 */
.brand-mark {
  position: relative;
  display: inline-block;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  border-radius: 9px;
  border: 1px dashed var(--ink-ghost);
  background: var(--surface);
  transition: border-color .25s ease, background .25s ease;
}
.brand-mark::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--ink-ghost);
  transition: transform .3s var(--ease-out), background .25s ease, width .25s ease, height .25s ease;
}
.brand:hover .brand-mark { border-color: var(--brand-line); }
.brand:hover .brand-mark::after { background: var(--brand); width: 7px; height: 7px; }

/* 导航链接 */
.nav-links {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 4px;
}
.nav-links a {
  position: relative;
  padding: 7px 12px;
  font-size: 14.5px;
  color: var(--ink-mid);
  border-radius: var(--pill);
  transition: color .2s ease, background .2s ease;
}
.nav-links a:hover { color: var(--ink); background: var(--surface); }

/* 右侧操作 */
.nav-actions { display: flex; align-items: center; gap: 8px; }

.icon-btn {
  display: grid;
  place-items: center;
  width: 34px; height: 34px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: transparent;
  color: var(--ink-mid);
  cursor: pointer;
  transition: background .2s ease, color .2s ease, transform .3s var(--ease-out);
}
.icon-btn:hover { background: var(--surface); color: var(--ink); }
.icon-btn:active { transform: scale(.92); }

.icon-btn .i-moon { display: none; }
[data-theme="dark"] .icon-btn .i-sun { display: none; }
[data-theme="dark"] .icon-btn .i-moon { display: block; }

.lang-switch {
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 3px;
  border-radius: var(--pill);
  background: var(--surface);
}
.lang-btn {
  padding: 4px 9px;
  border: none;
  border-radius: var(--pill);
  background: transparent;
  color: var(--ink-soft);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
  transition: background .2s ease, color .2s ease;
}
.lang-btn:hover { color: var(--ink); }
.lang-btn.is-active {
  background: var(--surface-solid);
  color: var(--ink);
  box-shadow: 0 1px 2px rgba(16, 24, 40, .08);
}
[data-theme="dark"] .lang-btn.is-active { background: rgba(255, 255, 255, .14); }

/* ============================================================
   按钮
   ============================================================ */
.btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid transparent;
  border-radius: var(--pill);
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  overflow: hidden;
  isolation: isolate;
  transition: transform .3s var(--ease-out), box-shadow .3s ease,
              background .25s ease, border-color .25s ease, color .25s ease;
}

/* 水滴扩散 */
.btn::after {
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  width: 160%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: currentColor;
  opacity: 0;
  z-index: -1;
  transform: translate(-50%, -50%) scale(0);
  transition: transform .45s ease-out, opacity .15s ease;
}
.btn:hover::after { opacity: .07; transform: translate(-50%, -50%) scale(1); }
.btn:active { transform: scale(.98); }

.btn-sm { height: 34px; padding: 0 15px; font-size: 14px; }
.btn-lg { height: 46px; padding: 0 24px; font-size: 15px; }

.btn-primary {
  background: var(--ink);
  color: var(--bg);
  box-shadow: var(--shadow-cta);
}
.btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(16, 24, 40, .08), 0 16px 32px -14px rgba(16, 24, 40, .38);
}
[data-theme="dark"] .btn-primary { background: #f0f4fb; color: #10151c; }

.btn-glass {
  background: var(--surface);
  border-color: var(--line-mid);
  color: var(--ink);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.btn-glass:hover {
  background: var(--surface-hi);
  border-color: var(--brand-line);
  transform: translateY(-1px);
}

.btn-ghost {
  background: transparent;
  color: var(--ink-mid);
}
.btn-ghost:hover { background: var(--surface); color: var(--ink); }

/* ============================================================
   主视觉
   ============================================================ */
.hero {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: min(100svh, 980px);
  padding: 132px 24px 0;
}

.hero-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 34px;
  width: 100%;
  max-width: 780px;
  flex: 1;
  justify-content: center;
  padding-bottom: 132px;
}

.hero-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 100%;
}

/* 主视觉里的大 Logo 空位 */
.logo-slot {
  display: grid;
  place-items: center;
  gap: 6px;
  width: 76px;
  height: 76px;
  padding: 10px 0 9px;
  border-radius: 24px;
  border: 1px dashed var(--ink-ghost);
  background: var(--surface);
  color: var(--ink-ghost);
  transition: border-color .28s ease, color .28s ease, background .28s ease, transform .4s var(--ease-out);
}
.logo-slot-hint {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .16em;
  line-height: 1;
}
.logo-slot:hover {
  border-color: var(--brand-line);
  color: var(--brand);
  background: var(--surface-hi);
  transform: translateY(-2px);
}

/* 大标语 */
.slogan {
  font-size: clamp(27px, 4vw, 38px);
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: .2em;
  text-indent: .2em;
  text-align: center;
  color: var(--ink);
  text-wrap: balance;
}

/* 副标题 */
.sub {
  max-width: 560px;
  text-align: center;
  font-size: 15px;
  line-height: 1.72;
  color: var(--ink-mid);
}

/* 标语与简介的占位态：换成你自己的文案后去掉 is-empty 即可 */
.slogan.is-empty,
.sub.is-empty { color: rgba(22, 28, 40, .44); }
[data-theme="dark"] .slogan.is-empty,
[data-theme="dark"] .sub.is-empty { color: rgba(255, 255, 255, .36); }

.hero-main {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 26px;
  width: 100%;
}

/* ============================================================
   CTA
   ============================================================ */
.cta-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

/* ============================================================
   页脚
   ============================================================ */
.footer {
  position: relative;
  z-index: 1;
  border-top: 1px solid var(--line);
  background: var(--bg);
  padding: 52px 24px 0;
}

.footer-inner {
  display: flex;
  gap: 56px;
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
  padding-bottom: 44px;
}

.footer-brand { flex: 0 0 260px; }
.footer-brand .brand { margin-bottom: 14px; }

.footer-desc {
  font-size: 13px;
  line-height: 1.75;
  color: var(--ink-soft);
  max-width: 240px;
}

.footer-cols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  flex: 1;
}

.footer-col { display: flex; flex-direction: column; gap: 11px; }
.footer-col h3 {
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--ink);
  margin-bottom: 2px;
}
.footer-col a {
  font-size: 13.5px;
  color: var(--ink-soft);
  width: fit-content;
  transition: color .2s ease, transform .2s ease;
}
.footer-col a:hover { color: var(--ink); transform: translateX(2px); }

.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  max-width: 1080px;
  margin: 0 auto;
  padding: 20px 0 26px;
  border-top: 1px solid var(--line);
  font-size: 12.5px;
  color: var(--ink-soft);
}
.footer-meta { color: var(--ink-ghost); }

/* ============================================================
   入场动画
   ============================================================ */
.reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .9s var(--ease), transform .9s var(--ease-out);
}
.reveal.is-in { opacity: 1; transform: none; }
.reveal.delay-1 { transition-delay: .12s; }

/* ============================================================
   响应式
   ============================================================ */
@media (max-width: 900px) {
  .nav-links { display: none; }
  .footer-inner { flex-direction: column; gap: 36px; }
  .footer-brand { flex: none; }
  .footer-desc { max-width: 320px; }
}

@media (min-width: 1600px) {
  .slogan { font-size: 42px; }
  .hero-inner { gap: 38px; max-width: 860px; }
}

@media (max-width: 767px) {
  .nav-wrap { width: calc(100% - 28px); padding-top: 8px; }
  .nav-bar { height: 52px; padding-left: 12px; }
  .brand-name { font-size: 16px; }
  .brand-mark { width: 26px; height: 26px; border-radius: 8px; }

  .hero { padding: 108px 18px 0; }
  .hero-inner { gap: 26px; padding-bottom: 28px; }
  .hero-head { gap: 20px; }
  .logo-slot { width: 68px; height: 68px; border-radius: 21px; }
  .slogan { letter-spacing: .1em; text-indent: .1em; line-height: 1.55; }
  .sub { font-size: 14px; max-width: 340px; }

  .cta-row { width: 100%; gap: 10px; }
  .cta-row .btn { flex: 1 1 140px; height: 44px; }

  .footer { padding: 40px 18px 0; }
  .footer-cols { gap: 22px; }
  .footer-bottom { padding-bottom: 22px; }
}

@media (max-width: 560px) {
  .hide-sm { display: none; }
  .footer-cols { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 400px) {
  .lang-switch { display: none; }
  .nav-actions { gap: 6px; }
  .nav-bar { padding-right: 6px; }
}

@media (max-width: 360px) {
  .brand-name { display: none; }
  .brand { gap: 0; }
  .nav-bar { height: 50px; }
}

/* 无障碍 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .reveal { opacity: 1; transform: none; }
}

:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
  border-radius: 6px;
}


/* ============================================================
   区块（工具 / 关于 / 联系）
   ============================================================ */
.section{
  position:relative;
  z-index:1;
  padding:clamp(60px, 7vw, 92px) 0;
}
.section-inner{
  width:min(1080px, calc(100% - 48px));
  margin:0 auto;
}
.section-alt{
  background:linear-gradient(180deg, transparent, rgba(63,106,230,.035), transparent);
}
[data-theme="dark"] .section-alt{
  background:linear-gradient(180deg, transparent, rgba(123,152,245,.05), transparent);
}

.eyebrow{
  display:inline-block;
  margin-bottom:12px;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-soft);
}
.section h2{
  margin:0 0 12px;
  font-size:clamp(26px, 3.4vw, 38px);
  font-weight:650;
  letter-spacing:-.02em;
}
.section-head{ max-width:600px; margin-bottom:36px; }
.section-head p{ margin:0; color:var(--ink-mid); line-height:1.75; }

/* ---------- 工具卡 ---------- */
.tool-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:16px;
}
.tool-card{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:172px;
  padding:22px;
  border-radius:var(--card);
  background:var(--surface);
  border:1px solid var(--line);
  box-shadow:var(--shadow-card);
  -webkit-backdrop-filter:blur(var(--blur));
  backdrop-filter:blur(var(--blur));
  transition:transform .35s var(--ease), border-color .35s var(--ease);
}
.tool-card:hover{ transform:translateY(-3px); border-color:var(--line-mid); }
.tool-top{ display:flex; align-items:center; justify-content:space-between; }
.tool-tag{
  padding:2px 9px;
  border-radius:var(--pill);
  border:1px solid var(--brand-line);
  background:var(--brand-tint);
  color:var(--brand);
  font-size:11px;
}
.tool-ver{ font-size:11px; color:var(--ink-ghost); }
.tool-card h3{ margin:6px 0 0; font-size:17px; font-weight:600; }
.tool-card p{ margin:0; color:var(--ink-mid); font-size:13.5px; line-height:1.65; }
.tool-state{ margin-top:auto; font-size:12px; color:var(--ink-soft); }

.tool-card.is-slot{
  grid-column:1 / -1;
  text-decoration:none;
  color:inherit;
  min-height:104px;
  display:grid;
  place-content:center;
  justify-items:center;
  gap:4px;
  border-style:dashed;
  background:transparent;
  box-shadow:none;
  text-align:center;
}
.slot-plus{ font-size:26px; line-height:1; color:var(--ink-ghost); }
.tool-card.is-slot h3{ margin:2px 0 0; font-size:15px; }
.tool-card.is-slot p{ font-size:12.5px; color:var(--ink-soft); }

/* ---------- 关于 ---------- */
.about-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:48px;
  align-items:start;
}
.about-copy p{ margin:0 0 12px; color:var(--ink-mid); line-height:1.85; }
.about-copy p:last-child{ margin-bottom:0; }

.facts{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.facts li{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:12px 0;
  border-bottom:1px solid var(--line);
  font-size:13.5px;
}
.facts span{ color:var(--ink-soft); }
.facts b{ font-weight:500; }

/* ---------- 联系 ---------- */
.contact-card{
  width:min(760px, 100%);
  margin:0 auto;
  padding:clamp(28px, 4vw, 42px);
  border-radius:var(--card);
  background:var(--surface-hi);
  border:1px solid var(--line);
  box-shadow:var(--shadow-card);
  -webkit-backdrop-filter:blur(var(--blur));
  backdrop-filter:blur(var(--blur));
  text-align:center;
}
.contact-card h2{ margin-bottom:10px; }
.contact-card p{ margin:0 0 22px; color:var(--ink-mid); }
.contact-card .btn{ display:inline-flex; align-items:center; padding:11px 22px; }

/* ---------- 响应式 ---------- */
@media (min-width:861px) and (max-width:1100px){
  .tool-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:860px){
  .tool-grid{ grid-template-columns:1fr; }
  .about-grid{ grid-template-columns:1fr; gap:28px; }
  .section-inner{ width:calc(100% - 36px); }
  .section{ padding:64px 0; }
}

/* ---------- logo ---------- */
.brand-logo{ width:30px; height:30px; display:block; flex-shrink:0; }
.hero-logo{
  width:116px;
  height:116px;
  display:block;
  filter:drop-shadow(0 10px 22px rgba(63,106,230,.18));
}
@media (max-width:600px){ .hero-logo{ width:84px; height:84px; } }

.section-more{
  margin-left:8px;
  color:var(--brand);
  text-decoration:none;
  white-space:nowrap;
}
.section-more:hover{ text-decoration:underline; }

/* 备案号 */
.beian{
  color:var(--ink-soft);
  text-decoration:none;
}
.beian:hover{ color:var(--ink); text-decoration:underline; }