/* ============================================================
   优乐玩主站 · 中文专区  共享样式 /assets/site.css
   技术蓝图网格 + 家庭手册节奏
   ============================================================ */

/* ---------- 1. 设计变量 ---------- */
:root{
  /* 色彩 */
  --c-snow:#14707E;
  --c-snow-deep:#0F5B66;
  --c-snow-soft:#E4F1F2;
  --c-gold:#E0A22B;
  --c-gold-deep:#CF911F;
  --c-gold-mist:#FBF0DA;
  --c-grape:#6B4A8C;
  --c-adil-red:#C0453B;
  --c-adil-green:#2F7D5C;
  --c-ink:#16303A;
  --c-ink-soft:rgba(22,48,58,.68);
  --c-ink-faint:rgba(22,48,58,.46);
  --c-paper:#F7F9FA;
  --c-white:#FFFFFF;
  --c-glass:rgba(255,255,255,.72);
  --c-glass-strong:rgba(255,255,255,.9);
  --c-grid:rgba(20,112,126,.14);
  --c-line:rgba(22,48,58,.14);
  --c-line-soft:rgba(22,48,58,.08);

  /* 字体 */
  --font-heading:"Alibaba PuHuiTi","HarmonyOS Sans SC","Source Han Sans SC","PingFang SC",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-body:"Source Han Sans SC","PingFang SC","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"JetBrains Mono","SFMono-Regular",Menlo,Consolas,ui-monospace,monospace;

  /* 尺度 */
  --shell:1240px;
  --gutter:24px;
  --gap:24px;
  --radius-s:10px;
  --radius-m:16px;
  --radius-l:24px;
  --shadow-1:0 2px 10px rgba(22,48,58,.06);
  --shadow-2:0 12px 30px rgba(22,48,58,.12);
  --dur:180ms;
  --ease:ease-out;
  --header-offset:104px;
}

/* ---------- 2. Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (prefers-reduced-motion: no-preference){
  html{scroll-behavior:smooth}
}
body{
  margin:0;
  background:var(--c-paper);
  color:var(--c-ink);
  font-family:var(--font-body);
  font-size:1rem;
  line-height:1.85;
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,h5,p,ul,ol,dl,dd,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
img,svg,video{display:block;max-width:100%}
table{border-collapse:collapse;width:100%}
input,textarea,select{font:inherit;color:inherit}
[id]{scroll-margin-top:var(--header-offset)}

/* ---------- 3. 基础排版 ---------- */
h1,h2,h3,h4{font-family:var(--font-heading);font-weight:700;color:var(--c-ink);letter-spacing:-.01em}
h1{font-size:clamp(2.1rem,4.2vw,3.4rem);line-height:1.2}
h2{font-size:clamp(1.5rem,2.4vw,2.1rem);line-height:1.35}
h3{font-size:1.15rem;font-weight:600;line-height:1.5}
h4{font-size:1rem;font-weight:600;line-height:1.5}
p{overflow-wrap:break-word}
.mono,.mono-num,.axis-label,.breadcrumb,.tag,.badge,.section-head__index,.card__index,
.index-list__num,.index-list__meta,.step__num,.timeline__meta,.footer-col__title,
.footer-contact__label,.footer-contact__value--mono,.footer-record,.footer-brand__hint{
  font-family:var(--font-mono);
  letter-spacing:.04em;
}
.text-soft{color:var(--c-ink-soft)}
.measure{max-width:68ch}
.axis-label{
  display:inline-block;
  font-size:.7rem;
  letter-spacing:.16em;
  color:rgba(20,112,126,.55);
}

/* ---------- 4. 布局骨架 ---------- */
.container{
  width:100%;
  max-width:var(--shell);
  margin-inline:auto;
  padding-inline:var(--gutter);
}
.section{
  position:relative;
  padding-block:clamp(48px,7vw,96px);
}
.section--band{background:var(--c-snow-soft)}
.section--mist{background:var(--c-gold-mist)}
.section > .container{position:relative;z-index:1}
.grid-field{
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(to right,var(--c-grid) 1px,transparent 1px),
    linear-gradient(to bottom,var(--c-grid) 1px,transparent 1px);
  background-size:72px 72px;
  opacity:.65;
}
.rule{
  height:1px;
  border:0;
  background:linear-gradient(90deg,var(--c-snow) 0%,var(--c-grid) 34%,transparent 100%);
}
.page-hero{
  position:relative;
  padding-block:clamp(36px,5vw,68px) clamp(28px,4vw,52px);
  overflow:hidden;
}
.page-hero__title{max-width:24ch}
.page-hero__lead{
  margin-top:14px;
  font-size:1.05rem;
  line-height:1.8;
  color:var(--c-ink-soft);
  max-width:62ch;
}
.page-hero__meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.section-head{
  display:flex;
  align-items:flex-start;
  gap:16px;
  margin-bottom:clamp(22px,3vw,38px);
}
.section-head__index{
  flex:0 0 auto;
  font-size:.82rem;
  color:var(--c-grape);
  padding-top:.6em;
}
.section-head__body{min-width:0;max-width:70ch}
.section-head__title{margin-bottom:.4em}
.section-head__lead{color:var(--c-ink-soft)}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.grid-split{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(24px,4vw,56px);
  align-items:center;
}
.grid-aside{
  display:grid;
  grid-template-columns:minmax(220px,280px) minmax(0,1fr);
  gap:clamp(24px,4vw,56px);
  align-items:start;
}
.sticky-col{position:sticky;top:var(--header-offset)}

/* ---------- 5. 按钮 ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5em;
  padding:.75em 1.4em;
  border-radius:999px;
  border:1px solid transparent;
  font-family:var(--font-heading);
  font-weight:600;
  font-size:.94rem;
  line-height:1.2;
  letter-spacing:.01em;
  cursor:pointer;
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease),
             border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
.btn--primary{background:var(--c-snow);color:#fff}
.btn--primary:hover{background:var(--c-snow-deep);box-shadow:0 8px 20px rgba(20,112,126,.24)}
.btn--gold{background:var(--c-gold);color:var(--c-ink)}
.btn--gold:hover{background:var(--c-gold-deep);box-shadow:0 8px 20px rgba(224,162,43,.28)}
.btn--ghost{background:rgba(255,255,255,.75);color:var(--c-ink);border-color:var(--c-line)}
.btn--ghost:hover{border-color:var(--c-snow);color:var(--c-snow-deep)}
.btn--block{width:100%}
.btn.is-done{background:var(--c-adil-green);color:#fff;border-color:transparent}

/* ---------- 6. 面包屑 ---------- */
.breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.55em;
  padding-block:18px;
  font-size:.78rem;
  color:var(--c-ink-faint);
}
.breadcrumb a{color:var(--c-ink-soft);transition:color var(--dur) var(--ease)}
.breadcrumb a:hover{color:var(--c-snow);text-decoration:underline;text-underline-offset:3px}
.breadcrumb__sep{color:var(--c-grid);font-size:.9em}

/* ---------- 7. 标记：标签与徽标 ---------- */
.tag{
  display:inline-flex;
  align-items:center;
  gap:.45em;
  padding:.32em .75em;
  border-radius:999px;
  font-size:.74rem;
  background:var(--c-snow-soft);
  color:var(--c-snow-deep);
}
.tag--grape{background:rgba(107,74,140,.12);color:var(--c-grape)}
.tag--gold{background:var(--c-gold-mist);color:#8A6114}
.badge{
  display:inline-flex;
  align-items:center;
  gap:.4em;
  padding:.3em .7em;
  border-radius:6px;
  font-size:.74rem;
  font-weight:600;
  white-space:nowrap;
}
.badge--official{background:var(--c-gold);color:var(--c-ink)}
.badge--beta{background:#fff;border:1px solid var(--c-snow);color:var(--c-snow-deep)}
.badge--diff{background:var(--c-adil-red);color:#fff}
.badge--ok{background:var(--c-adil-green);color:#fff}

/* ---------- 8. 卡片 ---------- */
.card{
  position:relative;
  background:var(--c-white);
  border:1px solid var(--c-line);
  border-radius:var(--radius-m);
  padding:clamp(18px,2vw,26px);
  transition:box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
.card:hover{box-shadow:var(--shadow-2);border-color:var(--c-snow)}
.card--snow{background:var(--c-snow-soft);border-color:var(--c-grid)}
.card--gold{background:var(--c-gold-mist);border-color:rgba(224,162,43,.3)}
.card__index{
  display:block;
  font-size:.78rem;
  color:var(--c-grape);
  margin-bottom:.6em;
}

/* ---------- 9. 密集索引列表 ---------- */
.index-list{border-top:1px solid var(--c-line)}
.index-list__item{
  display:grid;
  grid-template-columns:64px minmax(0,1fr) auto;
  gap:16px;
  align-items:baseline;
  padding:13px 10px;
  border-bottom:1px solid var(--c-line-soft);
  transition:background var(--dur) var(--ease);
}
.index-list__item:hover{background:var(--c-gold-mist)}
.index-list__num{font-size:.8rem;color:var(--c-grape)}
.index-list__title{font-weight:600}
.index-list__meta{font-size:.76rem;color:var(--c-ink-soft);white-space:nowrap}

/* ---------- 10. 编号步骤 ---------- */
.steps{display:grid;gap:14px}
.step{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start}
.step__num{
  font-size:.78rem;
  line-height:1.5;
  padding:.24em .6em;
  border-radius:8px;
  background:var(--c-snow);
  color:#fff;
}
.step__title{font-weight:600}
.step__text{margin-top:.15em;color:var(--c-ink-soft)}

/* ---------- 11. 时间轴（仅版本号 / 阶段名 / 周三节奏） ---------- */
.timeline{display:grid;gap:20px}
.timeline__item{position:relative;padding-left:30px}
.timeline__item::before{
  content:"";
  position:absolute;
  left:0;top:.5em;
  width:11px;height:11px;
  border-radius:50%;
  background:#fff;
  border:2px solid var(--c-grape);
  z-index:1;
}
.timeline__item::after{
  content:"";
  position:absolute;
  left:5px;top:1.7em;bottom:-20px;
  width:1px;
  background:var(--c-grid);
}
.timeline__item:last-child::after{display:none}
.timeline__meta{font-size:.76rem;color:var(--c-snow-deep)}

/* ---------- 12. 提示条 ---------- */
.notice-strip{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:14px 18px;
  border-radius:var(--radius-s);
  border:1px solid rgba(224,162,43,.34);
  border-left:4px solid var(--c-gold);
  background:var(--c-gold-mist);
  font-size:.92rem;
}
.notice-strip--read{
  background:rgba(192,69,59,.07);
  border-color:rgba(192,69,59,.28);
  border-left-color:var(--c-adil-red);
}
.notice-strip--ok{
  background:rgba(47,125,92,.08);
  border-color:rgba(47,125,92,.28);
  border-left-color:var(--c-adil-green);
}

/* ---------- 13. 图片容器基础规则 ---------- */
.media{
  position:relative;
  border:1px solid var(--c-line);
  border-radius:var(--radius-m);
  overflow:hidden;
  background:var(--c-white);
}
.media__frame{
  position:relative;
  width:100%;
  aspect-ratio:16 / 9;
  background-color:var(--c-snow-soft);
  background-image:
    linear-gradient(to right,var(--c-grid) 1px,transparent 1px),
    linear-gradient(to bottom,var(--c-grid) 1px,transparent 1px);
  background-size:26px 26px;
  overflow:hidden;
}
.media__frame--wide{aspect-ratio:21 / 9}
.media__frame--portrait{aspect-ratio:4 / 5}
.media__frame--square{aspect-ratio:1 / 1}
.media__img{width:100%;height:100%;object-fit:cover}
.media__caption{
  padding:.7em .95em;
  border-top:1px solid var(--c-line);
  background:#fff;
  font-size:.8rem;
  line-height:1.6;
  color:var(--c-ink-soft);
}

/* ---------- 14. 正文与章节链接 ---------- */
.prose{max-width:68ch}
.prose > * + *{margin-top:1.2em}
.prose h2{margin-top:2em}
.prose h3{margin-top:1.7em}
.prose li{position:relative;padding-left:1.4em;margin-top:.5em}
.prose li::before{
  content:"";
  position:absolute;left:.3em;top:.82em;
  width:6px;height:6px;border-radius:2px;
  background:var(--c-gold);
}
.section-link{
  display:block;
  padding:.5em .8em;
  border-left:2px solid transparent;
  border-radius:0 8px 8px 0;
  font-size:.9rem;
  color:var(--c-ink-soft);
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
.section-link:hover{background:var(--c-snow-soft);color:var(--c-snow-deep)}
.section-link.is-current{
  border-left-color:var(--c-snow);
  background:var(--c-snow-soft);
  color:var(--c-ink);
  font-weight:600;
}

/* ---------- 15. 页头：悬浮胶囊导航浮岛 ---------- */
.skip-link{
  position:fixed;
  left:50%;
  top:10px;
  transform:translate(-50%,-220%);
  z-index:200;
  padding:.62em 1.15em;
  border-radius:999px;
  background:var(--c-ink);
  color:#fff;
  font-family:var(--font-mono);
  font-size:.8rem;
  letter-spacing:.04em;
  transition:transform var(--dur) var(--ease);
}
.skip-link:focus{transform:translate(-50%,0)}

.site-header{
  position:sticky;
  top:0;
  z-index:100;
  padding-top:14px;
}
.nav-shell{
  position:relative;
  width:100%;
  max-width:var(--shell);
  margin-inline:auto;
  padding-inline:var(--gutter);
}
.nav-island{
  display:flex;
  align-items:center;
  gap:14px;
  padding:10px 12px 10px 18px;
  border-radius:999px;
  background:var(--c-glass);
  border:1px solid rgba(255,255,255,.75);
  box-shadow:0 6px 24px rgba(22,48,58,.1);
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  transition:background var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
.site-header[data-scrolled="true"] .nav-island{background:rgba(255,255,255,.58)}
.site-header[data-open] .nav-island{background:var(--c-glass-strong)}
.brand{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.brand__mark{
  position:relative;
  flex:0 0 auto;
  width:30px;height:30px;
  border-radius:9px;
  background:linear-gradient(140deg,var(--c-snow) 0%,var(--c-snow) 52%,var(--c-gold) 52%,var(--c-gold) 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.5);
}
.brand__mark::after{
  content:"";
  position:absolute;
  inset:8px;
  border-radius:3px;
  border:1.5px solid rgba(255,255,255,.85);
}
.brand__text{display:flex;flex-direction:column;line-height:1.18}
.brand__name{
  font-family:var(--font-heading);
  font-weight:700;
  font-size:1rem;
  letter-spacing:-.01em;
  color:var(--c-ink);
}
.brand__sub{font-size:.68rem;letter-spacing:.02em;color:var(--c-ink-soft)}
.site-nav{margin-left:auto;min-width:0}
.nav-links{display:flex;align-items:center;gap:2px}
.nav-link{
  display:inline-block;
  padding:.5em .82em;
  border-radius:999px;
  font-size:.9rem;
  font-weight:500;
  color:var(--c-ink);
  white-space:nowrap;
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease);
}
.nav-link:hover{background:var(--c-snow-soft);color:var(--c-snow-deep)}
.nav-link[aria-current="page"]{background:var(--c-snow);color:#fff}
.nav-link[aria-current="page"]:hover{background:var(--c-snow-deep);color:#fff}
.nav-tools{display:flex;align-items:center;gap:10px;margin-left:8px}
.nav-cta{padding:.62em 1.15em;font-size:.88rem}
.nav-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  width:42px;height:42px;
  border-radius:50%;
  border:1px solid var(--c-line);
  background:rgba(255,255,255,.72);
  transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease);
}
.nav-toggle:hover{border-color:var(--c-snow)}
.nav-toggle__bars{display:flex;flex-direction:column;gap:4px;width:18px}
.nav-toggle__bars span{
  display:block;height:2px;border-radius:2px;background:var(--c-ink);
  transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease);
}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.nav-progress{
  position:absolute;
  left:calc(var(--gutter) + 12px);
  right:calc(var(--gutter) + 12px);
  bottom:-3px;
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,var(--c-snow) 0%,var(--c-gold) 100%);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform 120ms linear;
}

/* ---------- 16. 页脚 ---------- */
.site-footer{
  position:relative;
  margin-top:clamp(56px,8vw,104px);
  background:var(--c-snow-soft);
  border-top:1px solid var(--c-grid);
  color:var(--c-ink);
  overflow:hidden;
}
.site-footer::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(to right,var(--c-grid) 1px,transparent 1px),
    linear-gradient(to bottom,var(--c-grid) 1px,transparent 1px);
  background-size:64px 64px;
  opacity:.5;
}
.footer-inner{position:relative;z-index:1}
.footer-top{
  display:grid;
  grid-template-columns:1.15fr 2fr 1.35fr;
  gap:clamp(24px,3vw,48px);
  padding-block:clamp(40px,5vw,64px) clamp(26px,3vw,40px);
}
.footer-brand{min-width:0}
.footer-brand__name{
  margin-top:14px;
  font-family:var(--font-heading);
  font-weight:700;
  font-size:1.15rem;
  letter-spacing:-.01em;
}
.footer-brand__line{margin-top:4px;font-size:.86rem;color:var(--c-ink-soft)}
.footer-brand__hint{
  display:inline-flex;
  align-items:center;
  margin-top:16px;
  padding:.36em .85em;
  border-radius:999px;
  background:rgba(255,255,255,.75);
  border:1px solid var(--c-grid);
  font-size:.74rem;
  color:var(--c-snow-deep);
}
.footer-cols{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}
.footer-col__title{
  margin-bottom:12px;
  font-size:.76rem;
  letter-spacing:.08em;
  color:var(--c-grape);
  font-weight:600;
}
.footer-links li + li{margin-top:8px}
.footer-link{
  font-size:.92rem;
  color:var(--c-ink);
  border-bottom:1px solid transparent;
  transition:color var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
.footer-link:hover{color:var(--c-snow-deep);border-bottom-color:var(--c-gold)}
.footer-contact{
  padding:20px;
  border-radius:var(--radius-m);
  background:rgba(255,255,255,.74);
  border:1px solid var(--c-line-soft);
}
.footer-contact__row + .footer-contact__row{margin-top:12px}
.footer-contact__label{
  display:block;
  font-size:.72rem;
  letter-spacing:.1em;
  color:var(--c-snow-deep);
}
.footer-contact__value{
  display:block;
  margin-top:2px;
  font-size:.9rem;
  line-height:1.7;
  overflow-wrap:anywhere;
}
.footer-contact__value--mono{letter-spacing:.04em}
.footer-contact__note{
  margin-top:14px;
  padding-top:12px;
  border-top:1px dashed var(--c-line);
  font-size:.78rem;
  line-height:1.7;
  color:var(--c-ink-soft);
}
.footer-bottom{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px 24px;
  padding-block:18px 30px;
  border-top:1px solid var(--c-grid);
  font-size:.8rem;
  color:var(--c-ink-soft);
}
.footer-record{color:var(--c-ink);font-size:.8rem}
.footer-copy{font-size:.8rem}
.footer-legal{display:flex;flex-wrap:wrap;gap:16px}
.footer-legal .footer-link{font-size:.8rem}

/* ---------- 17. 焦点与可访问性 ---------- */
:where(a,button,summary,input,textarea,select,[tabindex]):focus-visible{
  outline:2px solid var(--c-snow);
  outline-offset:2px;
  box-shadow:0 0 0 4px rgba(224,162,43,.55);
  border-radius:8px;
}
.nav-link:focus-visible,.btn:focus-visible,.footer-link:focus-visible{border-radius:999px}
.visually-hidden{
  position:absolute!important;
  width:1px;height:1px;
  margin:-1px;padding:0;
  overflow:hidden;clip:rect(0 0 0 0);
  white-space:nowrap;border:0;
}

/* ---------- 18. 响应式 ---------- */
@media (max-width:1080px){
  .nav-link{padding:.5em .68em;font-size:.87rem}
  .nav-island{gap:10px}
}
@media (max-width:980px){
  .nav-island{
    flex-wrap:wrap;
    gap:10px;
    padding:10px 12px;
    border-radius:24px;
  }
  .nav-toggle{display:inline-flex}
  .nav-cta{display:none}
  .site-nav{
    order:3;
    flex-basis:100%;
    display:none;
    margin-left:0;
  }
  .site-nav[data-open],
  .site-header[data-open] .site-nav{display:block}
  .nav-links{
    flex-direction:column;
    align-items:stretch;
    gap:2px;
    margin-top:8px;
    padding-top:8px;
    border-top:1px solid var(--c-line-soft);
  }
  .nav-link{padding:.7em .9em;border-radius:12px;font-size:.95rem}
  .footer-top{grid-template-columns:1fr 1fr}
  .footer-brand{grid-column:1 / -1}
  .footer-contact{grid-column:1 / -1}
  .grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-aside{grid-template-columns:minmax(0,1fr)}
  .sticky-col{position:static}
}
@media (max-width:760px){
  :root{--gutter:18px;--header-offset:88px}
  .grid-split{grid-template-columns:minmax(0,1fr)}
  .grid-2{grid-template-columns:minmax(0,1fr)}
  .footer-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
  .index-list__item{grid-template-columns:46px minmax(0,1fr);gap:12px}
  .index-list__meta{grid-column:2;white-space:normal}
}
@media (max-width:560px){
  .grid-3{grid-template-columns:minmax(0,1fr)}
  .brand__sub{display:none}
  .footer-cols{grid-template-columns:minmax(0,1fr)}
  .footer-bottom{flex-direction:column;align-items:flex-start}
  h1{font-size:clamp(1.8rem,8vw,2.4rem)}
}

/* ---------- 19. 降低动效 ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    transition-duration:.01ms!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
  }
  .card:hover{box-shadow:var(--shadow-1);border-color:var(--c-line)}
  .nav-progress{transition:none}
  .skip-link{transition:none}
}