/* ============================================================
   宝威体育 · 共享样式表 /assets/site.css
   高原侧轨 · 悬浮胶囊 · 纸张叠层 · 区间色块
   ============================================================ */

/* ---------- 1. 设计令牌 ---------- */
:root{
  --ink-900:#0B1B33;
  --ink-800:#14294A;
  --line-700:#24406B;
  --brand-500:#FF5A1F;
  --brand-400:#FF8A4C;
  --brand-700:#C7360F;
  --green-500:#3FA981;
  --green-700:#266E56;
  --snow:#F4F7FB;
  --paper:#EDE7DB;
  --cyan-400:#4FB6E8;
  --mist:#8698B0;

  --text:#F4F7FB;
  --text-dim:#C6D2E2;
  --text-mute:#8698B0;
  --on-paper:#1A2436;
  --on-paper-dim:#4B5766;

  --rail-w:88px;
  --panel-open:296px;
  --panel-closed:56px;
  --panel-w:var(--panel-open);

  --pad-x:clamp(18px,3vw,44px);
  --gap:clamp(16px,2.2vw,28px);

  --dur-1:120ms;
  --dur-2:200ms;
  --dur-3:240ms;
  --ease:cubic-bezier(.22,.61,.36,1);

  --radius-s:8px;
  --radius-m:14px;
  --radius-l:22px;
  --pill:999px;

  --frame:1px solid var(--line-700);
  --shadow-soft:0 26px 60px -44px rgba(0,0,0,.95);
  --font-sans:"Noto Sans SC","Source Han Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-mono:"IBM Plex Mono","Roboto Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,"Courier New",monospace;
}
html[data-panel="collapsed"]{ --panel-w:var(--panel-closed); }

/* ---------- 2. 重置 ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  min-height:100vh;
  font-family:var(--font-sans);
  font-size:17px;
  line-height:1.75;
  font-weight:400;
  color:var(--text-dim);
  background-color:var(--ink-900);
  background-image:
    radial-gradient(1100px 620px at 84% -12%, rgba(79,182,232,.16), rgba(79,182,232,0) 62%),
    radial-gradient(840px 520px at 4% 3%, rgba(255,90,31,.13), rgba(255,90,31,0) 66%),
    linear-gradient(180deg,#0B1B33 0%,#0A1730 62%,#091426 100%);
  background-repeat:no-repeat;
  padding-left:var(--rail-w);
  padding-right:var(--panel-w);
  transition:padding-left var(--dur-2) var(--ease), padding-right var(--dur-2) var(--ease);
}
main{ display:block; padding-top:clamp(92px,9vw,128px); }
img,svg,video{ display:block; max-width:100%; }
ul,ol{ margin:0; padding:0; list-style:none; }
a{ color:inherit; }
button{ font:inherit; color:inherit; background:none; border:0; }
table{ border-collapse:collapse; width:100%; }
[hidden]{ display:none !important; }

/* ---------- 3. 排版 ---------- */
h1,h2,h3,h4{ margin:0; font-family:var(--font-sans); color:var(--text); font-weight:900; letter-spacing:.01em; }
h1{ font-size:clamp(32px,4.6vw,64px); line-height:1.06; }
h2{ font-size:clamp(26px,3.2vw,44px); line-height:1.1; }
h3{ font-size:clamp(20px,2.2vw,28px); line-height:1.22; font-weight:800; }
h4{ font-size:17px; line-height:1.4; font-weight:700; }
p{ margin:0 0 1em; }
p:last-child{ margin-bottom:0; }
strong{ color:var(--text); font-weight:700; }
.lead{ font-size:clamp(17px,1.4vw,19px); color:var(--text-dim); max-width:34em; }
.num{ font-family:var(--font-mono); letter-spacing:-.02em; font-feature-settings:"tnum" 1; }
.label{ display:inline-block; font-size:12px; letter-spacing:.16em; color:var(--text-mute); }
.on-paper{ color:var(--on-paper); }
.on-paper-dim{ color:var(--on-paper-dim); }

/* ---------- 4. 可达性 ---------- */
.visually-hidden{
  position:absolute !important; width:1px; height:1px; margin:-1px;
  padding:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap;
}
.skip-link{
  position:fixed; top:10px; left:calc(var(--rail-w) + 12px); z-index:200;
  transform:translateY(-160%);
  padding:10px 18px; border-radius:var(--pill);
  background:var(--brand-500); color:#1B0A04; font-weight:700; font-size:14px;
  text-decoration:none; transition:transform var(--dur-2) var(--ease);
}
.skip-link:focus{ transform:translateY(0); }
:focus-visible{ outline:2px solid var(--brand-400); outline-offset:3px; border-radius:6px; }

/* ---------- 5. 布局容器 ---------- */
.shell{ width:100%; max-width:1360px; margin:0 auto; padding:0 var(--pad-x); }
.shell--wide{ max-width:1680px; }
.section{ padding:clamp(40px,6vw,88px) 0; }
.section__head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:14px; margin-bottom:clamp(20px,3vw,36px); }
.stack > * + *{ margin-top:var(--stack-gap,16px); }
.grid{ display:grid; gap:var(--gap); }
.grid--12{ grid-template-columns:repeat(12,minmax(0,1fr)); }
.span-2{ grid-column:span 2; }
.span-3{ grid-column:span 3; }
.span-4{ grid-column:span 4; }
.span-5{ grid-column:span 5; }
.span-6{ grid-column:span 6; }
.span-7{ grid-column:span 7; }
.span-8{ grid-column:span 8; }
.span-9{ grid-column:span 9; }
.span-10{ grid-column:span 10; }
.span-12{ grid-column:span 12; }

/* ---------- 6. 按钮 / 标签 ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:11px 20px; border-radius:var(--pill); border:1px solid transparent;
  font-size:14px; font-weight:700; letter-spacing:.04em; text-decoration:none; cursor:pointer;
  transition:background var(--dur-2) var(--ease), color var(--dur-2) var(--ease),
             border-color var(--dur-2) var(--ease), transform var(--dur-1) var(--ease);
}
.btn--primary{ background:var(--brand-500); color:#1B0A04; box-shadow:0 14px 30px -18px rgba(255,90,31,.95); }
.btn--primary:hover{ background:var(--brand-400); transform:translateY(-1px); }
.btn--ghost{ border-color:var(--line-700); color:var(--text); background:rgba(20,41,74,.42); }
.btn--ghost:hover{ border-color:var(--brand-400); color:var(--brand-400); }
.btn--paper{ background:var(--paper); color:var(--on-paper); }
.btn--paper:hover{ background:#fff; }
.btn--sm{ padding:8px 15px; font-size:13px; }
.btn--block{ width:100%; }

.tag{
  display:inline-flex; align-items:center; gap:6px;
  padding:4px 11px; border-radius:var(--pill);
  font-size:12px; letter-spacing:.1em;
  border:1px solid var(--line-700); color:var(--text-dim); background:rgba(20,41,74,.6);
}
.tag--brand{ background:var(--brand-400); border-color:var(--brand-400); color:#1B0A04; font-weight:700; }
.tag--green{ background:var(--green-500); border-color:var(--green-500); color:#06251B; font-weight:700; }
.tag--paper{ background:var(--paper); border-color:var(--paper); color:var(--on-paper); }

/* ---------- 7. 面包屑 ---------- */
.breadcrumb{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:13px; color:var(--text-mute); }
.breadcrumb a{ color:var(--text-dim); text-decoration:none; border-bottom:1px solid transparent; }
.breadcrumb a:hover{ color:var(--brand-400); border-bottom-color:var(--brand-400); }
.breadcrumb__sep{ color:var(--line-700); }
.breadcrumb__current{ color:var(--text); }

/* ---------- 8. 纸张 / 面板 / 图片容器 ---------- */
.paper{
  position:relative;
  background:var(--paper); color:var(--on-paper);
  border-radius:var(--radius-m);
  padding:clamp(18px,2.4vw,28px);
  box-shadow:var(--shadow-soft);
}
.paper--stack{ box-shadow:10px 10px 0 -1px rgba(36,64,107,.42), var(--shadow-soft); }
.frame{
  border:var(--frame); border-radius:var(--radius-m);
  background:rgba(20,41,74,.5);
  padding:clamp(16px,2vw,24px);
}
.media{
  position:relative; display:block; width:100%; overflow:hidden;
  border-radius:var(--radius-m); border:var(--frame);
  aspect-ratio:16/9;
  background:
    radial-gradient(120% 90% at 78% 8%, rgba(79,182,232,.32), rgba(79,182,232,0) 60%),
    linear-gradient(180deg,#16294A 0%,#0B1B33 100%);
}
.media > img, .media > picture > img{ width:100%; height:100%; object-fit:cover; }
.media--wide{ aspect-ratio:21/9; }
.media--tall{ aspect-ratio:4/5; }
.media--square{ aspect-ratio:1/1; }
.media__ridge{
  position:absolute; left:0; right:0; bottom:0; height:54%; pointer-events:none;
  background:linear-gradient(180deg, rgba(20,41,74,.12), rgba(9,20,38,.96));
  clip-path:polygon(0 64%,13% 42%,25% 58%,39% 26%,53% 54%,67% 34%,81% 60%,91% 46%,100% 62%,100% 100%,0 100%);
}
.media__caption{
  position:absolute; left:14px; right:14px; bottom:12px;
  font-size:12px; letter-spacing:.1em; color:var(--snow);
  text-shadow:0 2px 14px rgba(0,0,0,.85);
}

/* ---------- 9. 头部外壳 ---------- */
.site-header{ position:fixed; inset:0; z-index:90; pointer-events:none; }
.site-header > *{ pointer-events:auto; }

/* 9.1 左侧品牌轨道 */
.rail{
  position:absolute; top:0; left:0; bottom:0; width:var(--rail-w); z-index:2;
  display:flex; flex-direction:column; align-items:center;
  gap:16px; padding:18px 0 20px;
  background:linear-gradient(180deg,#0A1830 0%,#0B1B33 55%,#0D2138 100%);
  border-right:var(--frame);
}
.rail__brand{ display:flex; flex-direction:column; align-items:center; gap:10px; text-decoration:none; }
.rail__mark{
  writing-mode:vertical-rl; text-orientation:upright;
  font-size:20px; font-weight:900; letter-spacing:.1em; color:var(--snow);
  padding:12px 7px; border:var(--frame); border-radius:var(--radius-s);
  background:linear-gradient(180deg, rgba(255,90,31,.22), rgba(255,90,31,0));
}
.rail__brand:hover .rail__mark{ border-color:var(--brand-500); }
.rail__sub{
  writing-mode:vertical-rl; text-orientation:upright;
  font-size:11px; letter-spacing:.24em; color:var(--text-mute);
}
.rail__nav{
  flex:1 1 auto; min-height:0; overflow:hidden;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
}
.rail__link{
  writing-mode:vertical-rl; text-orientation:upright;
  font-size:12px; letter-spacing:.2em; color:var(--text-dim); text-decoration:none;
  padding:7px 5px; border:1px solid transparent; border-radius:var(--radius-s);
  transition:color var(--dur-2) var(--ease), background var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease);
}
.rail__link:hover{ color:var(--snow); border-color:var(--line-700); background:rgba(79,182,232,.1); }
.rail__link[aria-current="page"]{
  color:#1B0A04; font-weight:700; background:var(--brand-500); border-color:var(--brand-500);
}
.rail__foot{ margin-top:auto; display:flex; flex-direction:column; align-items:center; gap:14px; }
.rail__progress{
  display:block; width:3px; height:74px; border-radius:var(--pill);
  background:var(--ink-800); overflow:hidden;
}
.rail__progress i{
  display:block; width:100%; height:0%;
  background:linear-gradient(180deg,var(--brand-400),var(--brand-500));
  transition:height var(--dur-1) linear;
}
.rail__toggle{
  display:flex; flex-direction:column; align-items:center; gap:7px;
  padding:8px 4px; border-radius:var(--radius-s); cursor:pointer;
  color:var(--text-mute); font-size:11px; letter-spacing:.2em;
  transition:color var(--dur-2) var(--ease);
}
.rail__toggle:hover{ color:var(--brand-400); }
.rail__toggle-icon{
  display:block; position:relative; width:16px; height:12px;
  border:1px solid currentColor; border-radius:3px;
}
.rail__toggle-icon::after{
  content:""; position:absolute; top:-1px; bottom:-1px; left:50%;
  width:1px; background:currentColor; transform:translateX(-50%);
}

/* 9.2 悬浮胶囊导航 */
.capsule{
  position:absolute; z-index:3; top:14px;
  left:calc(var(--rail-w) + var(--pad-x)); right:calc(var(--panel-w) + var(--pad-x));
  display:flex; align-items:center; gap:12px;
  padding:10px 12px 10px 16px;
  border:var(--frame); border-radius:var(--pill);
  background:rgba(20,41,74,.84);
  box-shadow:0 22px 46px -32px rgba(0,0,0,.95);
  transition:top var(--dur-2) var(--ease), padding var(--dur-2) var(--ease),
             background var(--dur-2) var(--ease), right var(--dur-2) var(--ease);
}
.site-header.is-condensed .capsule{
  top:8px; padding:6px 10px 6px 14px; background:rgba(11,27,51,.94);
}
.capsule__brand{ display:flex; align-items:center; gap:10px; flex:0 0 auto; min-width:0; text-decoration:none; }
.capsule__glyph{
  width:34px; height:34px; border-radius:11px; display:grid; place-items:center;
  font-family:var(--font-mono); font-size:12px; font-weight:700; letter-spacing:.04em;
  color:#1B0A04;
  background:linear-gradient(140deg,var(--brand-400),var(--brand-500) 58%,var(--brand-700));
}
.capsule__brandtext{ display:flex; flex-direction:column; line-height:1.18; }
.capsule__name{ font-size:15px; font-weight:800; letter-spacing:.06em; color:var(--snow); }
.capsule__sub{ font-size:11px; letter-spacing:.08em; color:var(--text-mute); }
.site-header.is-condensed .capsule__sub{ display:none; }
.capsule__nav{
  display:flex; align-items:center; gap:12px;
  flex:1 1 auto; min-width:0; margin-left:auto; justify-content:flex-end;
}
.capsule__list{ display:flex; align-items:center; gap:2px; flex-wrap:wrap; justify-content:flex-end; }
.capsule__link{
  position:relative; display:inline-block; padding:9px 12px; border-radius:var(--pill);
  font-size:14px; letter-spacing:.06em; color:var(--text-dim); text-decoration:none;
  transition:color var(--dur-2) var(--ease), background var(--dur-2) var(--ease);
}
.capsule__link:hover{ color:var(--snow); background:rgba(79,182,232,.14); }
.capsule__link[aria-current="page"]{
  color:var(--snow); background:rgba(255,90,31,.16);
  box-shadow:inset 0 0 0 1px rgba(255,138,76,.6);
}
.capsule__link[aria-current="page"]::after{
  content:""; position:absolute; left:50%; bottom:3px; width:14px; height:2px;
  border-radius:2px; background:var(--brand-500); transform:translateX(-50%);
}
.capsule__utility{ display:flex; align-items:center; gap:6px; flex:0 0 auto; }
.icon-btn{
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  padding:9px 13px; border-radius:var(--pill); border:var(--frame);
  background:rgba(11,27,51,.5); color:var(--text-dim);
  font-size:13px; letter-spacing:.06em;
  transition:color var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease), background var(--dur-2) var(--ease);
}
.icon-btn:hover{ color:var(--snow); border-color:var(--brand-400); }
.icon-btn__dot{ width:7px; height:7px; border-radius:2px; background:var(--cyan-400); flex:0 0 auto; transition:background var(--dur-2) var(--ease); }
.icon-btn[aria-expanded="true"] .icon-btn__dot{ background:var(--brand-500); }
.capsule__cta{ flex:0 0 auto; white-space:nowrap; }
.capsule__toggle{
  display:none; width:40px; height:40px; flex:0 0 auto; cursor:pointer;
  align-items:center; justify-content:center; border-radius:12px;
  border:var(--frame); background:rgba(11,27,51,.6);
}
.capsule__toggle-bars{ position:relative; width:18px; height:2px; border-radius:2px; background:var(--snow); }
.capsule__toggle-bars::before,.capsule__toggle-bars::after{
  content:""; position:absolute; left:0; width:18px; height:2px; border-radius:2px; background:var(--snow);
  transition:transform var(--dur-2) var(--ease), top var(--dur-2) var(--ease), background var(--dur-2) var(--ease);
}
.capsule__toggle-bars::before{ top:-6px; }
.capsule__toggle-bars::after{ top:6px; }
.capsule__toggle[aria-expanded="true"] .capsule__toggle-bars{ background:var(--brand-500); }
.capsule__toggle[aria-expanded="true"] .capsule__toggle-bars::before{ top:0; transform:rotate(45deg); background:var(--brand-500); }
.capsule__toggle[aria-expanded="true"] .capsule__toggle-bars::after{ top:0; transform:rotate(-45deg); background:var(--brand-500); }
.capsule__search{
  position:absolute; top:calc(100% + 10px); right:8px;
  width:min(340px,calc(100vw - 48px));
  padding:16px; border-radius:var(--radius-m);
  border:var(--frame); background:rgba(20,41,74,.98);
  box-shadow:0 30px 60px -36px rgba(0,0,0,.95);
}
.capsule__search-title{ font-size:12px; letter-spacing:.16em; color:var(--brand-400); margin:0 0 6px; }
.capsule__search-text{ font-size:13px; color:var(--text-mute); margin:0 0 10px; }
.capsule__search-list{ display:flex; flex-direction:column; gap:6px; }
.capsule__search-link{
  display:block; padding:9px 12px; border-radius:var(--radius-s);
  font-size:13.5px; color:var(--text-dim); text-decoration:none;
  background:rgba(11,27,51,.6); border:1px solid transparent;
  transition:color var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease);
}
.capsule__search-link:hover{ color:var(--snow); border-color:var(--brand-400); }

/* 9.3 右侧服务面板 */
.service-panel{
  position:absolute; z-index:1; top:0; right:0; bottom:0; width:var(--panel-w);
  display:flex; flex-direction:column;
  overflow:hidden auto;
  background:linear-gradient(180deg, rgba(20,41,74,.97), rgba(11,27,51,.99));
  border-left:var(--frame);
  transition:width var(--dur-2) var(--ease), transform var(--dur-2) var(--ease);
}
.panel__head{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:16px 18px; border-bottom:var(--frame); flex:0 0 auto;
}
.panel__label{ font-size:12px; letter-spacing:.16em; color:var(--text-mute); }
.panel__toggle{
  width:28px; height:28px; flex:0 0 auto; display:grid; place-items:center;
  border:var(--frame); border-radius:var(--radius-s); cursor:pointer;
  transition:border-color var(--dur-2) var(--ease);
}
.panel__toggle:hover{ border-color:var(--brand-400); }
.panel__toggle span{
  width:8px; height:8px; border-right:2px solid var(--brand-400); border-bottom:2px solid var(--brand-400);
  transform:rotate(-45deg); transition:transform var(--dur-2) var(--ease);
}
html[data-panel="collapsed"] .panel__toggle span{ transform:rotate(135deg); }
.panel__spine{ display:none; }
.panel__body{ padding:14px 14px 20px; display:flex; flex-direction:column; gap:10px; }
.panel__item{
  display:flex; flex-direction:column; gap:4px;
  padding:13px 14px; border-radius:var(--radius-m);
  border:1px solid transparent; background:rgba(11,27,51,.5); text-decoration:none;
  transition:border-color var(--dur-2) var(--ease), background var(--dur-2) var(--ease), transform var(--dur-2) var(--ease);
}
.panel__item:hover{ border-color:var(--brand-400); background:rgba(255,90,31,.1); transform:translateX(-2px); }
.panel__item-k{ font-size:14.5px; font-weight:700; color:var(--snow); }
.panel__item-m{ font-size:12.5px; line-height:1.6; color:var(--text-mute); }
.panel__note{
  margin:6px 2px 0; padding-top:12px; border-top:1px dashed var(--line-700);
  font-size:12px; letter-spacing:.06em; color:var(--text-mute);
}
html[data-panel="collapsed"] .panel__label,
html[data-panel="collapsed"] .panel__body{ display:none; }
html[data-panel="collapsed"] .panel__head{
  flex-direction:column; gap:14px; padding:16px 0; border-bottom:0;
}
html[data-panel="collapsed"] .panel__spine{
  display:block; margin:12px auto 0;
  writing-mode:vertical-rl; text-orientation:upright;
  font-size:11px; letter-spacing:.24em; color:var(--text-mute);
}

/* ---------- 10. 内容组件 ---------- */
/* 10.1 可展开内容组（单开） */
.accordion{ display:flex; flex-direction:column; gap:10px; }
.accordion__item{
  border:var(--frame); border-radius:var(--radius-m);
  background:rgba(20,41,74,.5); overflow:hidden;
  transition:border-color var(--dur-2) var(--ease), background var(--dur-2) var(--ease);
}
.accordion__item[data-open]{ border-color:var(--brand-500); background:rgba(255,90,31,.07); }
.accordion__trigger{
  display:flex; align-items:center; gap:12px; width:100%;
  padding:15px 16px; text-align:left; cursor:pointer;
  font-size:16px; font-weight:700; color:var(--snow);
}
.accordion__trigger::before{
  content:""; flex:0 0 auto; width:10px; height:10px; border-radius:3px;
  background:var(--line-700);
  transition:background var(--dur-2) var(--ease), box-shadow var(--dur-2) var(--ease);
}
.accordion__item[data-open] .accordion__trigger::before{
  background:var(--brand-500); box-shadow:0 0 0 3px rgba(255,90,31,.2);
}
.accordion__panel{
  display:grid; grid-template-rows:0fr;
  transition:grid-template-rows var(--dur-3) var(--ease);
}
.accordion__panel > div{ overflow:hidden; min-height:0; visibility:hidden; transition:visibility 0s linear var(--dur-3); }
.accordion__item[data-open] .accordion__panel{ grid-template-rows:1fr; }
.accordion__item[data-open] .accordion__panel > div{ visibility:visible; transition-delay:0s; }
.accordion__content{
  margin:0; padding:0 18px 18px 38px;
  font-size:15.5px; line-height:1.75; color:var(--text-dim);
}

/* 10.2 标签筛选 */
.filter-bar{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.filter-chip{
  padding:7px 15px; border-radius:var(--pill); cursor:pointer;
  border:var(--frame); background:rgba(20,41,74,.55);
  font-size:13px; letter-spacing:.06em; color:var(--text-dim);
  transition:background var(--dur-2) var(--ease), color var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease);
}
.filter-chip:hover{ color:var(--snow); border-color:var(--brand-400); }
.filter-chip[aria-pressed="true"]{
  background:var(--brand-500); border-color:var(--brand-500); color:#1B0A04; font-weight:700;
}
.filter-empty{ padding:22px; border-radius:var(--radius-m); border:1px dashed var(--line-700); color:var(--text-mute); font-size:14px; }

/* 10.3 更新日志 / 时间线 */
.log{ display:flex; flex-direction:column; gap:20px; padding-left:22px; border-left:1px solid var(--line-700); }
.log__row{ position:relative; }
.log__row::before{
  content:""; position:absolute; left:-26px; top:7px;
  width:9px; height:9px; border-radius:50%;
  background:var(--ink-900); border:2px solid var(--brand-500);
}
.log__time{ font-family:var(--font-mono); font-size:12.5px; letter-spacing:.04em; color:var(--cyan-400); }
.log__title{ margin:5px 0 4px; font-size:16.5px; font-weight:700; color:var(--snow); }
.log__text{ margin:0; font-size:15px; color:var(--text-dim); }

/* 10.4 区间色块 */
.intervals{ display:flex; flex-wrap:wrap; gap:8px; }
.interval{
  flex:1 1 0; min-width:62px; padding:11px 8px; text-align:center;
  border:var(--frame); border-radius:var(--radius-s); background:rgba(20,41,74,.62);
  opacity:.42; transform:translateY(6px);
  transition:opacity var(--dur-3) var(--ease), transform var(--dur-3) var(--ease), border-color var(--dur-2) var(--ease);
}
.interval.is-lit{ opacity:1; transform:none; }
.interval__time{ display:block; font-family:var(--font-mono); font-size:12px; color:var(--text-mute); }
.interval__value{ display:block; font-family:var(--font-mono); font-size:18px; font-weight:600; color:var(--snow); }
.interval--hot{ border-color:var(--brand-500); background:linear-gradient(180deg, rgba(255,90,31,.3), rgba(255,90,31,.06)); }
.interval--hot .interval__value{ color:var(--brand-400); }
.interval--calm{ border-color:var(--green-700); background:linear-gradient(180deg, rgba(63,169,129,.24), rgba(63,169,129,.04)); }
.interval--calm .interval__value{ color:var(--green-500); }

/* 10.5 进入视口显现 */
[data-reveal]{
  opacity:0; transform:translateY(14px);
  transition:opacity var(--dur-3) var(--ease), transform var(--dur-3) var(--ease);
}
[data-reveal].is-visible{ opacity:1; transform:none; }

/* ---------- 11. 页脚 ---------- */
.site-footer{
  position:relative;
  margin-top:clamp(48px,7vw,96px);
  background:var(--paper); color:var(--on-paper);
  border-top:4px solid var(--brand-500);
}
.site-footer::before{
  content:""; position:absolute; inset:0 0 auto 0; height:6px; opacity:.16;
  background:repeating-linear-gradient(90deg, var(--ink-900) 0 14px, transparent 14px 28px);
}
.footer__inner{
  display:grid; grid-template-columns:1.5fr 2fr 1.3fr;
  gap:clamp(24px,4vw,56px);
  max-width:1360px; margin:0 auto;
  padding:clamp(34px,5vw,66px) var(--pad-x) clamp(24px,3vw,40px);
}
.footer__mark{ margin:0; font-size:clamp(22px,2.4vw,28px); font-weight:900; letter-spacing:.04em; color:var(--ink-900); }
.footer__tagline{ margin:6px 0 12px; font-size:13px; letter-spacing:.1em; color:var(--brand-700); }
.footer__note{ margin:0; font-size:14.5px; line-height:1.75; color:var(--on-paper-dim); max-width:30em; }
.footer__cols{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,2.4vw,32px); }
.footer__title{
  margin:0 0 12px; font-size:12px; font-weight:700; letter-spacing:.16em;
  color:var(--ink-900); text-transform:uppercase;
}
.footer__list{ display:flex; flex-direction:column; gap:8px; }
.footer__list a{
  font-size:14.5px; color:var(--on-paper-dim); text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease);
}
.footer__list a:hover{ color:var(--brand-700); border-bottom-color:var(--brand-700); }
.footer__list a[aria-current="page"]{ color:var(--brand-700); font-weight:700; }
.footer__contact{ display:flex; flex-direction:column; gap:6px; }
.footer__line{ display:flex; flex-wrap:wrap; gap:8px; margin:0; font-size:14px; }
.footer__key{ flex:0 0 42px; color:#7B7171; letter-spacing:.08em; font-size:12.5px; padding-top:2px; }
.footer__value{ color:var(--ink-900); font-family:var(--font-mono); font-size:13.5px; letter-spacing:-.01em; word-break:break-all; }
.footer__hint{ margin:10px 0 0; font-size:12.5px; line-height:1.7; color:#6C747F; max-width:26em; }
.footer__legal{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px;
  max-width:1360px; margin:0 auto;
  padding:16px var(--pad-x) 22px;
  border-top:1px solid rgba(11,27,51,.16);
}
.footer__icp,.footer__copy{ margin:0; font-size:12.5px; letter-spacing:.06em; color:#5C6472; font-family:var(--font-mono); }

/* ---------- 12. 响应式 ---------- */
@media (max-width:1180px){
  html[data-panel]{ --panel-w:0px; }
  html[data-panel] .service-panel{
    width:min(300px,86vw); transform:translateX(102%); pointer-events:none;
    box-shadow:-40px 0 70px -50px rgba(0,0,0,.95);
  }
  html[data-panel="expanded"] .service-panel{ transform:translateX(0); pointer-events:auto; }
  html[data-panel] .panel__spine{ display:none; }
  html[data-panel] .panel__head{ flex-direction:row; gap:8px; padding:16px 18px; border-bottom:var(--frame); }
  html[data-panel="collapsed"] .panel__label,
  html[data-panel="collapsed"] .panel__body{ display:flex; }
  html[data-panel="collapsed"] .panel__label{ display:inline-block; }
  .capsule{ right:var(--pad-x); }
}
@media (max-width:1024px){
  .capsule__link{ padding:8px 9px; font-size:13px; }
  .icon-btn__text{ font-size:12.5px; }
  .footer__inner{ grid-template-columns:1fr 1fr; }
  .footer__contact{ grid-column:1 / -1; }
}
@media (max-width:820px){
  :root{ --rail-w:0px; }
  .rail{ display:none; }
  .capsule{
    left:var(--pad-x); right:var(--pad-x);
    border-radius:var(--radius-l); padding:9px 10px 9px 12px;
  }
  .site-header.is-condensed .capsule{ top:8px; padding:7px 10px; }
  .capsule__toggle{ display:inline-flex; }
  .capsule__nav{
    position:absolute; top:calc(100% + 10px); left:0; right:0;
    display:none; flex-direction:column; align-items:stretch; gap:4px;
    margin:0; padding:12px;
    max-height:min(72vh,540px); overflow:auto;
    border:var(--frame); border-radius:var(--radius-l);
    background:rgba(11,27,51,.985);
    box-shadow:0 34px 66px -38px rgba(0,0,0,.98);
  }
  .capsule__nav[data-open]{ display:flex; }
  .capsule__list{ flex-direction:column; align-items:stretch; gap:2px; }
  .capsule__link{
    display:block; padding:12px 14px; border-radius:var(--radius-s); font-size:15px;
  }
  .capsule__link[aria-current="page"]{
    box-shadow:inset 3px 0 0 var(--brand-500); background:rgba(255,90,31,.16);
  }
  .capsule__link[aria-current="page"]::after{ display:none; }
  .capsule__utility{
    flex-direction:column; align-items:stretch; gap:8px;
    margin-top:10px; padding-top:12px; border-top:1px dashed var(--line-700);
  }
  .icon-btn{ justify-content:flex-start; }
  .capsule__cta{ width:100%; }
  .capsule__search{ right:0; left:0; width:auto; }
  .grid--12{ grid-template-columns:1fr; }
  .grid--12 > *{ grid-column:1 / -1 !important; }
  .footer__inner{ grid-template-columns:1fr; }
  .footer__cols{ grid-template-columns:1fr 1fr; }
  .accordion__content{ padding-left:18px; }
  .interval{ min-width:calc(33.333% - 6px); }
}
@media (max-width:520px){
  body{ font-size:16px; }
  .footer__cols{ grid-template-columns:1fr; }
  .footer__legal{ flex-direction:column; align-items:flex-start; }
  .interval{ min-width:calc(50% - 6px); }
}
@media (max-height:720px){
  .rail__sub{ display:none; }
}
@media (max-height:660px){
  .rail__nav{ display:none; }
}

/* ---------- 13. 减少动态效果 ---------- */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  [data-reveal]{ opacity:1; transform:none; }
  .interval{ opacity:1; transform:none; }
  .panel__item:hover{ transform:none; }
  .btn--primary:hover{ transform:none; }
}
