/* =========================================================
   逸贝娱乐 /assets/site.css
   共享外壳：刷新刊头 + 左侧版本轨道 + 页脚 + 通用组件
   ========================================================= */

:root{
  --c-night:#0B1A2E;
  --c-night-deep:#060E18;
  --c-indigo:#142A45;
  --c-lake:#2FB6C4;
  --c-volt:#6FE3D2;
  --c-gold:#E8B24C;
  --c-coral:#F2704A;
  --c-mist:#E8EEF4;
  --c-stone:#8FA3B8;
  --c-paper:#F4EDE0;
  --c-slate:#3E5A6B;

  --rail-w:0px;
  --shell:1180px;
  --pad-x:clamp(16px,3.2vw,40px);
  --r:4px;

  --line:rgba(143,163,184,.26);
  --line-soft:rgba(143,163,184,.14);
  --line-strong:rgba(143,163,184,.5);

  --font-display:"Noto Serif SC","Source Han Serif SC","Songti SC","SimSun",serif;
  --font-head:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --font-mono:"JetBrains Mono","IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --shadow-card:0 1px 0 rgba(6,14,24,.5),0 18px 34px -26px rgba(0,0,0,.95);
  --ease:cubic-bezier(.2,.7,.3,1);
}
@media (min-width:1080px){ :root{ --rail-w:76px; } }

/* ---------------- reset ---------------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body,h1,h2,h3,h4,h5,p,figure,blockquote,dl,dd,ul,ol{ margin:0; }
ul,ol{ padding:0; list-style:none; }
img,svg{ display:block; max-width:100%; }
button{ font:inherit; color:inherit; }
[hidden]{ display:none !important; }

body{
  min-height:100vh;
  background-color:var(--c-night);
  background-image:
    radial-gradient(1100px 620px at 10% -12%, rgba(47,182,196,.17), transparent 62%),
    radial-gradient(900px 520px at 100% 6%, rgba(232,178,76,.10), transparent 66%),
    linear-gradient(180deg,#0B1A2E 0%,#091524 62%,#060E18 100%);
  background-repeat:no-repeat;
  color:var(--c-mist);
  font-family:var(--font-head);
  font-size:16px;
  font-weight:400;
  line-height:1.85;
  letter-spacing:.01em;
}
@media (min-width:768px){ body{ background-attachment:fixed; } }

main{ display:block; padding-left:var(--rail-w); }

/* ---------------- 排版 ---------------- */
h1,h2,h3,h4{ font-family:var(--font-head); font-weight:800; letter-spacing:.04em; line-height:1.32; color:var(--c-mist); }
h1{ font-size:clamp(28px,4vw,44px); }
h2{ font-size:clamp(22px,2.6vw,30px); }
h3{ font-size:18px; }
a{ color:var(--c-lake); text-underline-offset:3px; }
a:hover{ color:var(--c-volt); }
strong,b{ font-weight:700; }

.eyebrow{ font-family:var(--font-mono); font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--c-lake); }
.sec-index{ font-family:var(--font-mono); font-size:12px; letter-spacing:.14em; color:var(--c-gold); }
.section-label{ font-family:var(--font-display); font-weight:600; letter-spacing:.06em; color:var(--c-paper); }
.lede{ color:var(--c-stone); max-width:42em; }
.muted{ color:var(--c-stone); }
.mono{ font-family:var(--font-mono); letter-spacing:.04em; }

.prose{ max-width:42em; }
.prose p+p{ margin-top:1.05em; }
.prose ul,.prose ol{ margin:1em 0; padding-left:1.4em; list-style:disc; }
.prose ol{ list-style:decimal; }
.prose li{ margin-bottom:.45em; }
.prose a{ color:var(--c-volt); }

/* ---------------- 容器与栅格 ---------------- */
.shell{ width:100%; max-width:var(--shell); margin-inline:auto; padding-inline:var(--pad-x); }
.section{ padding-block:clamp(36px,6vw,76px); }
.section + .section{ border-top:1px solid var(--line-soft); }
.section-head{ display:flex; flex-direction:column; gap:8px; margin-bottom:clamp(20px,3vw,32px); }
.section-title{ font-size:clamp(22px,2.6vw,30px); }
.divider{ height:1px; border:0; background:var(--line-soft); margin-block:clamp(24px,4vw,40px); }

.grid{ display:grid; gap:clamp(16px,2.4vw,28px); }
.cols-7-5,.cols-8-4,.cols-2{ grid-template-columns:1fr; }
@media (min-width:880px){
  .cols-7-5{ grid-template-columns:7fr 5fr; }
  .cols-8-4{ grid-template-columns:8fr 4fr; }
  .cols-2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .offset > *:nth-child(even){ margin-top:28px; }
}

/* ---------------- 按钮与标签 ---------------- */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 16px; border-radius:var(--r);
  border:1px solid transparent;
  font-family:var(--font-head); font-size:13.5px; font-weight:700; letter-spacing:.06em;
  text-decoration:none; cursor:pointer;
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s var(--ease);
}
.btn-gold{ background:var(--c-gold); color:#20160a; border-color:rgba(255,255,255,.2); }
.btn-gold:hover{ background:#f3c265; color:#20160a; transform:translateY(-1px); }
.btn-ghost{ background:rgba(47,182,196,.08); color:var(--c-volt); border-color:rgba(111,227,210,.38); }
.btn-ghost:hover{ background:rgba(47,182,196,.2); color:var(--c-volt); }
.btn-quiet{ background:transparent; color:var(--c-mist); border-color:var(--line-strong); }
.btn-quiet:hover{ color:var(--c-gold); border-color:rgba(232,178,76,.55); }
.btn-coral{ background:rgba(242,112,74,.14); color:var(--c-coral); border-color:rgba(242,112,74,.45); }
.btn-coral:hover{ background:rgba(242,112,74,.24); color:var(--c-coral); }

.tag{
  display:inline-flex; align-items:center; gap:6px;
  padding:3px 8px; border-radius:2px;
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.14em;
  background:rgba(47,182,196,.12); color:var(--c-volt); border:1px solid rgba(111,227,210,.34);
}
.tag-gold{ background:rgba(232,178,76,.14); color:var(--c-gold); border-color:rgba(232,178,76,.4); }
.tag-coral{ background:rgba(242,112,74,.14); color:var(--c-coral); border-color:rgba(242,112,74,.42); }

/* ---------------- 卡片、纸张、斜切 ---------------- */
.card{
  position:relative;
  padding:clamp(18px,2.4vw,26px);
  background:linear-gradient(180deg,rgba(20,42,69,.94),rgba(11,26,46,.94));
  border:1px solid var(--line);
  border-radius:var(--r);
  box-shadow:var(--shadow-card);
}
.card-title{ font-size:18px; margin-bottom:8px; }
.card p{ color:var(--c-stone); }

.paper{
  padding:clamp(18px,2.4vw,28px);
  background:var(--c-paper); color:#17202b;
  border:1px solid rgba(255,255,255,.55);
  border-radius:var(--r);
  box-shadow:0 16px 30px -26px rgba(0,0,0,.9);
}
.paper h2,.paper h3,.paper .card-title{ color:#101a25; }
.paper p,.paper li{ color:#3d4b5a; }
.paper a{ color:#0d6a76; }

.cut{
  padding:clamp(14px,2vw,22px);
  background:linear-gradient(120deg,var(--c-lake),var(--c-volt));
  color:#04202a; border-radius:2px;
  clip-path:polygon(0 0,100% 0,calc(100% - 18px) 100%,0 100%);
}
.cut strong{ color:#02222b; }

.stat{
  display:flex; flex-direction:column; gap:2px;
  padding:14px 18px;
  border-left:3px solid var(--c-lake);
  background:linear-gradient(120deg,rgba(47,182,196,.18),rgba(232,178,76,.08));
  clip-path:polygon(0 0,100% 0,calc(100% - 12px) 100%,0 100%);
}
.stat-num{ font-family:var(--font-mono); font-size:clamp(20px,3vw,28px); color:var(--c-gold); letter-spacing:.02em; }
.stat-label{ font-size:12.5px; color:var(--c-stone); }

/* ---------------- 表格 ---------------- */
.table-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:var(--r); background:rgba(6,14,24,.35); }
.data-table{ width:100%; border-collapse:collapse; font-size:14px; }
.data-table caption{ padding-bottom:8px; text-align:left; font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; color:var(--c-stone); }
.data-table th,.data-table td{ padding:10px 12px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line-soft); }
.data-table thead th{ font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; color:var(--c-lake); background:rgba(62,90,107,.24); border-bottom:1px solid var(--line); }
.data-table tbody tr:nth-child(even){ background:rgba(62,90,107,.16); }
.data-table td.num{ font-family:var(--font-mono); color:var(--c-gold); }

[data-diff-table].is-diff-only tbody tr[data-same]{ display:none; }
[data-diff-table] tbody tr[data-diff] td:first-child{ box-shadow:inset 3px 0 0 var(--c-coral); }

/* ---------------- 折叠组 ---------------- */
.collapse-group{ display:grid; gap:10px; }
.collapse-actions{ display:flex; flex-wrap:wrap; gap:8px; }
details.collapse{
  border:1px solid var(--line); border-radius:var(--r);
  background:rgba(20,42,69,.55); overflow:hidden;
  transition:border-color .2s ease;
}
details.collapse > summary{
  display:flex; align-items:center; gap:10px;
  padding:14px 16px; cursor:pointer;
  font-weight:700; letter-spacing:.04em; list-style:none;
}
details.collapse > summary::-webkit-details-marker{ display:none; }
details.collapse > summary::before{ content:""; width:2px; align-self:stretch; min-height:18px; border-radius:2px; background:var(--c-stone); transition:background .2s ease; }
details.collapse[open] > summary::before{ background:var(--c-gold); }
details.collapse[open] > summary{ background:rgba(47,182,196,.08); }
details.collapse > summary:hover{ color:var(--c-volt); }
.collapse-body{ padding:2px 16px 18px; border-top:1px solid var(--line-soft); color:var(--c-stone); }

/* ---------------- 时间线 ---------------- */
.timeline{ position:relative; display:grid; gap:22px; padding-left:26px; }
.timeline::before{ content:""; position:absolute; left:6px; top:6px; bottom:6px; width:1px; background:linear-gradient(180deg,var(--c-lake),rgba(143,163,184,.18)); }
.timeline-item{ position:relative; }
.timeline-item::before{ content:""; position:absolute; left:-24px; top:8px; width:9px; height:9px; border-radius:50%; background:var(--c-night); border:2px solid var(--c-lake); }
.timeline-mark{ font-family:var(--font-mono); font-size:11px; letter-spacing:.14em; color:var(--c-gold); }

/* ---------------- 图片容器 ---------------- */
.media-frame{
  position:relative; width:100%; aspect-ratio:var(--ratio,16/9);
  overflow:hidden; border:1px solid var(--line); border-radius:var(--r);
  background:
    radial-gradient(120% 90% at 20% 0%, rgba(47,182,196,.3), transparent 62%),
    repeating-linear-gradient(115deg, rgba(143,163,184,.14) 0 1px, transparent 1px 13px),
    linear-gradient(180deg,#122742,#081324);
}
.media-frame img{ width:100%; height:100%; object-fit:cover; }
.media-frame figcaption{
  position:absolute; left:0; right:0; bottom:0;
  padding:10px 12px;
  font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; color:var(--c-mist);
  background:linear-gradient(180deg,transparent,rgba(6,14,24,.9));
}
.media-frame.is-4x3{ --ratio:4/3; }
.media-frame.is-3x2{ --ratio:3/2; }
.media-frame.is-1x1{ --ratio:1/1; }

/* ---------------- 面包屑 ---------------- */
.crumbs{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.08em; color:var(--c-stone); }
.crumbs ol{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.crumbs li+li::before{ content:"/"; margin-right:8px; color:rgba(143,163,184,.6); }
.crumbs a{ color:var(--c-stone); text-decoration:none; }
.crumbs a:hover{ color:var(--c-volt); }
.crumbs li[aria-current="page"]{ color:var(--c-mist); }

/* ---------------- 焦点与减弱动效 ---------------- */
:focus-visible{ outline:2px solid var(--c-gold); outline-offset:2px; border-radius:2px; }

.js [data-reveal]{ opacity:0; transform:translateY(16px); transition:opacity .5s ease,transform .5s var(--ease); }
.js [data-reveal][data-revealed="true"]{ opacity:1; transform:none; }

@keyframes yb-pulse{
  0%,100%{ opacity:.55; box-shadow:0 0 0 0 rgba(111,227,210,.42); }
  50%{ opacity:1; box-shadow:0 0 0 6px rgba(111,227,210,0); }
}
.status-dot{
  display:inline-block; width:8px; height:8px; border-radius:50%;
  background:var(--c-volt); flex:none;
  animation:yb-pulse 2.4s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .status-dot{ animation:none; opacity:1; }
  .js [data-reveal]{ opacity:1; transform:none; }
}

/* =========================================================
   头部外壳
   ========================================================= */
.skip-link{
  position:absolute; left:14px; top:-70px; z-index:130;
  padding:10px 16px; border-radius:var(--r);
  background:var(--c-gold); color:#20160a; font-weight:700; text-decoration:none;
  transition:top .18s ease;
}
.skip-link:focus{ top:12px; color:#20160a; }

.site-header{
  position:sticky; top:0; z-index:60;
  padding-left:var(--rail-w);
  background:rgba(11,26,46,.94);
  border-bottom:1px solid var(--line);
  transition:background .25s ease,box-shadow .25s ease;
}
@supports ((-webkit-backdrop-filter:blur(2px)) or (backdrop-filter:blur(2px))){
  .site-header{ -webkit-backdrop-filter:blur(12px) saturate(125%); backdrop-filter:blur(12px) saturate(125%); }
}
.site-header[data-scrolled="true"]{ background:rgba(6,14,24,.97); box-shadow:0 22px 34px -30px rgba(0,0,0,.95); }

.header-inner{ width:100%; max-width:var(--shell); margin-inline:auto; padding-inline:var(--pad-x); }

.head-utility{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:8px 0 7px;
  border-bottom:1px dashed rgba(143,163,184,.22);
  font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; color:var(--c-stone);
}
.head-utility-left,.head-utility-right{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.head-utility a{ color:var(--c-stone); text-decoration:none; }
.head-utility a:hover{ color:var(--c-volt); }

.badge-region{
  display:inline-flex; align-items:center; gap:6px;
  padding:3px 9px; border-radius:999px;
  border:1px solid rgba(111,227,210,.42);
  background:rgba(47,182,196,.1); color:var(--c-volt);
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.12em;
}
.badge-region::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--c-volt); box-shadow:0 0 0 3px rgba(111,227,210,.18); }

.badge-mono{
  display:inline-flex; align-items:center;
  padding:3px 9px; border-radius:999px;
  border:1px solid var(--line); color:var(--c-stone);
  font-family:var(--font-mono); font-size:11px; letter-spacing:.1em;
}

.head-icp{ white-space:nowrap; }
.head-contact{ white-space:nowrap; }

.version-chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:3px 9px; border-radius:2px;
  border:1px solid rgba(232,178,76,.42);
  background:rgba(232,178,76,.1); color:var(--c-gold);
  font-family:var(--font-mono); font-size:11px; letter-spacing:.1em;
}
.version-chip b{ font-weight:600; }

.rail-toggle{
  display:none;
  align-items:center; gap:6px;
  padding:4px 10px; border-radius:2px;
  background:transparent; border:1px solid var(--line-strong);
  color:var(--c-mist); cursor:pointer;
  font-family:var(--font-mono); font-size:11px; letter-spacing:.1em;
}
.rail-toggle:hover{ color:var(--c-gold); border-color:rgba(232,178,76,.5); }

.masthead{
  display:flex; flex-direction:column; align-items:center; gap:4px;
  padding:14px 0 12px; text-align:center;
}
.masthead-kicker{
  font-family:var(--font-mono); font-size:11px; letter-spacing:.34em;
  color:var(--c-lake); text-transform:uppercase;
}
.brand{
  position:relative;
  font-family:var(--font-display); font-weight:600;
  font-size:clamp(28px,4.4vw,44px); letter-spacing:.18em; text-indent:.18em;
  color:var(--c-mist); text-decoration:none; line-height:1.14;
  transition:color .2s ease,font-size .22s ease;
}
.brand:hover{ color:var(--c-gold); }
.brand::before,.brand::after{
  content:""; position:absolute; top:52%; height:1px;
  width:clamp(18px,6vw,64px);
}
.brand::before{ right:100%; margin-right:18px; background:linear-gradient(90deg,transparent,rgba(143,163,184,.6)); }
.brand::after{ left:100%; margin-left:18px; background:linear-gradient(90deg,rgba(143,163,184,.6),transparent); }
.masthead-meta{ font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; color:var(--c-stone); }

.nav-row{
  display:grid; grid-template-columns:1fr auto 1fr;
  align-items:center; gap:12px;
  padding:10px 0 12px;
  border-top:1px solid var(--line-soft);
}
.site-nav ul{ display:flex; align-items:center; gap:clamp(10px,1.6vw,26px); }
.site-nav a{
  display:inline-flex; align-items:baseline; gap:5px;
  padding:6px 2px;
  color:var(--c-mist); text-decoration:none;
  font-size:14px; letter-spacing:.06em;
  border-bottom:2px solid transparent;
  transition:color .18s ease,border-color .18s ease;
}
.site-nav a:hover{ color:var(--c-volt); }
.site-nav a[aria-current="page"]{ color:var(--c-volt); border-bottom-color:var(--c-lake); }
.nav-idx{ font-family:var(--font-mono); font-size:9px; color:var(--c-stone); }
.site-nav a[aria-current="page"] .nav-idx{ color:var(--c-gold); }

.head-cta{ display:flex; justify-self:end; align-items:center; gap:8px; flex-wrap:wrap; }

.nav-toggle{
  display:none; align-items:center; gap:8px;
  padding:8px 12px; border-radius:var(--r);
  background:rgba(20,42,69,.7); border:1px solid var(--line);
  color:var(--c-mist); cursor:pointer;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.1em;
}
.nav-toggle-icon{ display:inline-flex; flex-direction:column; gap:3px; }
.nav-toggle-icon i{ display:block; width:14px; height:1.5px; background:var(--c-lake); }

.scroll-progress{
  position:absolute; left:0; right:0; bottom:-1px; height:2px;
  transform:scaleX(0); transform-origin:0 50%;
  background:linear-gradient(90deg,var(--c-lake),var(--c-volt) 52%,var(--c-gold));
  transition:transform .12s linear;
  pointer-events:none;
}

.site-header[data-scrolled="true"] .head-utility{ display:none; }
.site-header[data-scrolled="true"] .masthead-kicker,
.site-header[data-scrolled="true"] .masthead-meta{ display:none; }
.site-header[data-scrolled="true"] .masthead{ padding:8px 0 4px; }
.site-header[data-scrolled="true"] .brand{ font-size:clamp(20px,2.4vw,28px); }
.site-header[data-scrolled="true"] .nav-row{ padding:6px 0 8px; }

/* =========================================================
   左侧版本轨道
   ========================================================= */
.rail{
  position:fixed; left:0; top:0; bottom:0; z-index:80;
  display:flex; flex-direction:column; align-items:center; gap:14px;
  width:var(--rail-w);
  padding:16px 6px;
  overflow-y:auto;
  background:linear-gradient(180deg,#060E18,#0A1727 42%,#060E18);
  border-right:1px solid rgba(143,163,184,.24);
}
.rail::after{
  content:""; position:absolute; left:50%; top:0; bottom:0; width:1px;
  background:linear-gradient(180deg,transparent,rgba(47,182,196,.28) 22%,rgba(143,163,184,.16) 78%,transparent);
  pointer-events:none;
}
.rail-title{
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.3em; color:var(--c-stone);
  writing-mode:vertical-rl; text-orientation:mixed;
}
.rail-close{ display:none; }
.rail-options{ display:flex; flex-direction:column; align-items:center; gap:6px; width:100%; }
.rail-option{
  width:100%; max-width:58px; padding:7px 4px;
  text-align:center; cursor:pointer;
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.06em;
  color:var(--c-stone); background:rgba(20,42,69,.6);
  border:1px solid var(--line); border-radius:2px;
  transition:color .2s ease,background .2s ease,border-color .2s ease,transform .24s var(--ease);
}
.rail-option:hover{ color:var(--c-mist); border-color:var(--line-strong); }
.rail-option[aria-pressed="true"]{
  color:#04202a; background:linear-gradient(120deg,var(--c-lake),var(--c-volt));
  border-color:transparent; transform:translateX(3px);
}
.rail-ticks{ display:flex; flex-direction:column; align-items:center; gap:9px; margin:4px 0 auto; }
.rail-ticks li{ width:14px; height:1px; background:rgba(143,163,184,.45); transition:background .3s ease,width .3s ease,box-shadow .3s ease; }
.rail-ticks li.is-active{ width:22px; background:var(--c-lake); box-shadow:0 0 8px rgba(47,182,196,.75); }

.rail-status{ display:flex; flex-direction:column; align-items:center; gap:6px; }
.rail-status-text{ font-family:var(--font-mono); font-size:9.5px; letter-spacing:.1em; color:var(--c-stone); writing-mode:vertical-rl; }
.rail-foot{
  display:flex; gap:10px; margin-top:6px;
  font-family:var(--font-mono); font-size:9.5px; letter-spacing:.14em; color:var(--c-stone);
  writing-mode:vertical-rl;
}
.rail-scrim{ position:fixed; inset:0; z-index:70; background:rgba(6,14,24,.66); border:0; }
@media (min-width:1080px){ .rail-scrim{ display:none !important; } }
@media (max-height:700px){ .rail-ticks{ display:none; } }

/* =========================================================
   页脚
   ========================================================= */
.site-footer{
  padding-left:var(--rail-w);
  margin-top:clamp(48px,7vw,110px);
  background:linear-gradient(180deg,rgba(6,14,24,.35),#060E18 45%);
  border-top:1px solid var(--line);
}
.site-footer::before{
  content:""; display:block; height:2px;
  background:linear-gradient(90deg,var(--c-lake),var(--c-volt) 40%,var(--c-gold) 74%,var(--c-coral));
  opacity:.75;
}
.footer-inner{
  display:grid; grid-template-columns:1fr; gap:clamp(24px,4vw,56px);
  width:100%; max-width:var(--shell); margin-inline:auto;
  padding:clamp(34px,5vw,60px) var(--pad-x) clamp(24px,3vw,36px);
}
@media (min-width:880px){ .footer-inner{ grid-template-columns:minmax(0,1fr) minmax(0,1.35fr); } }

.footer-brand{ display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.brand-footer{ font-size:clamp(22px,2.6vw,30px); }
.brand-footer::before,.brand-footer::after{ display:none; }
.footer-tag{ max-width:34em; color:var(--c-stone); font-size:13.5px; }
.footer-badges{ display:flex; flex-wrap:wrap; gap:8px; }

.footer-cols{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
@media (min-width:620px){ .footer-cols{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.footer-col-title{
  margin-bottom:10px;
  font-family:var(--font-display); font-weight:600; font-size:13px; letter-spacing:.24em;
  color:var(--c-lake);
}
.footer-links{ display:grid; gap:2px; }
.footer-links a{
  display:inline-block; padding:5px 0;
  color:var(--c-mist); text-decoration:none; font-size:14px;
  border-bottom:1px solid transparent;
  transition:color .18s ease,border-color .18s ease;
}
.footer-links a:hover{ color:var(--c-gold); border-bottom-color:rgba(232,178,76,.45); }

.footer-contact{ border-top:1px dashed var(--line); background:rgba(20,42,69,.35); }
.footer-contact-inner{
  display:grid; gap:8px;
  width:100%; max-width:var(--shell); margin-inline:auto;
  padding:clamp(18px,3vw,28px) var(--pad-x);
}
.footer-contact-line{ font-family:var(--font-mono); font-size:12.5px; letter-spacing:.04em; color:var(--c-mist); }
.footer-note{ max-width:62em; font-size:12.5px; color:var(--c-stone); }

.footer-legal-inner{
  display:flex; flex-wrap:wrap; align-items:center; gap:12px 20px;
  width:100%; max-width:var(--shell); margin-inline:auto;
  padding:16px var(--pad-x) 30px;
  border-top:1px dashed var(--line);
  font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; color:var(--c-stone);
}
.footer-copy{ white-space:nowrap; }
.footer-status{ display:inline-flex; align-items:center; gap:8px; color:var(--c-volt); }
.footer-legal-links{ display:inline-flex; flex-wrap:wrap; gap:14px; }
.footer-legal-links a{ color:var(--c-stone); text-decoration:none; }
.footer-legal-links a:hover{ color:var(--c-volt); }
.back-top{
  margin-left:auto;
  padding:6px 12px; border-radius:var(--r);
  background:transparent; border:1px solid var(--line);
  color:var(--c-mist); cursor:pointer;
  font-family:var(--font-mono); font-size:11px; letter-spacing:.1em;
  transition:border-color .18s ease,color .18s ease;
}
.back-top:hover{ color:var(--c-gold); border-color:rgba(232,178,76,.5); }

/* =========================================================
   响应式：平板与手机
   ========================================================= */
@media (max-width:1079px){
  .rail{
    width:min(282px,84vw);
    transform:translateX(-103%);
    align-items:flex-start; gap:12px;
    padding:22px 18px;
    border-right:1px solid rgba(143,163,184,.32);
    box-shadow:26px 0 60px -34px #000;
    z-index:95;
    transition:transform .26s var(--ease);
  }
  .rail[data-open="true"]{ transform:translateX(0); }
  .rail::after{ display:none; }
  .rail-title{ writing-mode:horizontal-tb; font-size:12px; letter-spacing:.24em; color:var(--c-lake); }
  .rail-close{
    display:inline-flex; align-items:center;
    padding:5px 12px; border-radius:2px;
    background:transparent; border:1px solid var(--line); color:var(--c-mist);
    cursor:pointer; font-family:var(--font-mono); font-size:11px; letter-spacing:.1em;
  }
  .rail-options{ flex-direction:row; flex-wrap:wrap; align-items:stretch; width:100%; margin-top:4px; }
  .rail-option{ flex:1 1 62px; max-width:none; }
  .rail-option[aria-pressed="true"]{ transform:none; }
  .rail-ticks{ display:none; }
  .rail-status{ flex-direction:row; align-items:center; gap:8px; margin-top:auto; }
  .rail-status-text{ writing-mode:horizontal-tb; font-size:11px; }
  .rail-foot{ writing-mode:horizontal-tb; flex-direction:column; gap:4px; font-size:11px; }
  .rail-toggle{ display:inline-flex; }
}

@media (max-width:1000px){
  .nav-row{
    grid-template-columns:auto auto;
    grid-template-areas:"toggle cta" "nav nav";
    justify-content:space-between;
    gap:8px;
  }
  .nav-toggle{ grid-area:toggle; display:inline-flex; }
  .head-cta{ grid-area:cta; justify-self:end; }
  .site-nav{
    grid-area:nav;
    width:100%;
    max-height:0; opacity:0; visibility:hidden; overflow:hidden;
    transition:max-height .3s var(--ease),opacity .2s ease,visibility .2s ease;
  }
  .site-nav[data-open="true"]{ max-height:520px; opacity:1; visibility:visible; }
  .site-nav ul{ flex-direction:column; align-items:stretch; gap:0; border-top:1px solid var(--line-soft); }
  .site-nav a{
    justify-content:space-between; font-size:15px; padding:12px 6px;
    border-bottom:1px solid var(--line-soft);
  }
  .site-nav a[aria-current="page"]{
    border-bottom-color:var(--line-soft);
    background:rgba(47,182,196,.09);
  }
  .nav-idx{ order:2; }
}

@media (max-width:760px){
  .head-contact-mail{ display:none; }
  .head-utility{ font-size:10.5px; }
}
@media (max-width:640px){
  .brand::before,.brand::after{ display:none; }
  .head-icp{ display:none; }
  .btn{ padding:8px 13px; font-size:12.5px; }
  .masthead{ padding:12px 0 10px; }
  .footer-legal-inner{ gap:10px 16px; }
  .back-top{ margin-left:0; }
}
