/* =====================================================
   Clash下载 · clash06.com —— 组件层
   Hero 轨道装置 / 花瓣手记特性卡 / tab / toc / FAQ /
   术语卡 / 下载卡 / 文章卡 / callout / dl-fab / 表格 / 正文排版
   ===================================================== */

/* ============ Hero:orbit-core 居中构图 ============ */
.hero{
  position:relative;
  height:calc(100vh - var(--nav-h) - 56px);
  min-height:640px;
}

/* 层次最底:大半径蜜桃暖晕,几乎不可察 */
.hero::before{
  content:"";
  position:absolute;
  left:50%;
  top:calc(var(--orbit-top) + var(--orbit-size)/2);
  width:120vmin;
  max-width:100%; /* 暖晕不得宽于视口,否则窄屏产生横向溢出 */
  height:120vmin;
  transform:translate(-50%,-50%);
  background:radial-gradient(closest-side,var(--halo),var(--halo-0) 72%);
  pointer-events:none;
  z-index:0;
}

/* ---- 首屏装置容器:品牌内核居中,两圈虚线轨道环绕 ---- */
.hero-stage{
  position:absolute;
  left:50%;
  top:var(--orbit-top);
  width:var(--orbit-size);
  height:var(--orbit-size);
  transform:translateX(-50%);
  z-index:1;
  pointer-events:none;
}

.orbit{
  display:block;
  width:100%;
  height:100%;
}

.ring-outer{
  fill:none;
  stroke:var(--peach-deep);
  stroke-width:1.5;
  stroke-dasharray:2 9;
  stroke-linecap:round;
  opacity:.75;
}

.ring-inner{
  fill:none;
  stroke:var(--border);
  stroke-width:1.5;
  stroke-dasharray:2 8;
  stroke-linecap:round;
}

/* 外圈:协议名词小牌沿轨道缓行,自身反向自转保持端正 */
.orbit .spin{
  transform-box:fill-box;
  transform-origin:center;
  animation:orbitSpin 90s linear infinite;
}

@keyframes orbitSpin{
  to{transform:rotate(360deg);}
}

.tag-hold{
  transform-box:fill-box;
  transform-origin:center;
  animation:orbitHold 90s linear infinite;
}

@keyframes orbitHold{
  to{transform:rotate(-360deg);}
}

.tag-hold rect{
  fill:var(--bg-panel);
  stroke:var(--border);
  stroke-width:1;
}

.tag-hold text{
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:.04em;
  fill:var(--text-muted);
}

/* 内圈:五枚蜜桃小珠反向缓行,与下方五枚平台胶囊一一呼应 */
.orbit .drift{
  transform-box:fill-box;
  transform-origin:center;
  animation:orbitDrift 60s linear infinite reverse;
}

@keyframes orbitDrift{
  to{transform:rotate(360deg);}
}

.dot{
  fill:var(--peach-deep);
  transition:fill .3s ease;
}

.hero:has(.cap[data-dot="d1"]:hover) .d1,
.hero:has(.cap[data-dot="d2"]:hover) .d2,
.hero:has(.cap[data-dot="d3"]:hover) .d3,
.hero:has(.cap[data-dot="d4"]:hover) .d4,
.hero:has(.cap[data-dot="d5"]:hover) .d5{
  fill:var(--accent);
}

/* 内核:品牌同款超椭圆渐变底 + 白色几何小猫,极轻呼吸 */
.emblem{
  transform-box:fill-box;
  transform-origin:center;
  animation:emblemBreath 7s ease-in-out infinite;
  filter:var(--shadow-emblem);
}

@keyframes emblemBreath{
  0%,100%{transform:scale(1);}
  50%{transform:scale(1.03);}
}

.emblem-bg-a{stop-color:var(--accent);}
.emblem-bg-b{stop-color:var(--accent-dark);}
.emblem-cat{fill:var(--bg-panel);}
.emblem-eye{fill:var(--accent-dark);}

/* ---- 标题层(压在装置上方) ---- */
.hero-copy{
  position:relative;
  z-index:2;
  text-align:center;
  padding-top:20px;
  padding-left:var(--gutter);
  padding-right:var(--gutter);
  max-width:880px;
  margin:0 auto;
}

.hero-title{
  font-family:var(--font-display);
  font-size:clamp(50px,5.4vw,74px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.015em;
  color:var(--text);
}

.hero-title em{
  font-style:normal;
  color:var(--accent);
}

.hero-sub{
  display:block;
  font-size:clamp(16px,1.4vw,20px);
  font-weight:400;
  letter-spacing:.16em;
  color:var(--text-muted);
  margin-top:12px;
}

.hero-desc{
  font-size:17px;
  color:var(--text-muted);
  margin-top:14px;
}

.hero-desc strong{
  color:var(--accent-dark);
  font-weight:600;
}

.hero-cta{
  display:flex;
  justify-content:center;
  gap:16px;
  margin-top:24px;
}

/* ---- 小胶囊标签行(可通用) ---- */
.chip-row{
  list-style:none;
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
  margin-top:20px;
}

.chip-row a{
  display:inline-flex;
  align-items:center;
  gap:7px;
  text-decoration:none;
  font-size:13px;
  color:var(--text-muted);
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  padding:6px 15px;
  max-width:100%;
  overflow:hidden;
  transition:color .2s ease,border-color .2s ease;
}

.chip-row a::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--peach-deep);
  flex-shrink:0;
  transition:background-color .2s ease;
}

.chip-row a:hover{
  color:var(--accent-dark);
  border-color:var(--peach-deep);
}

.chip-row a:hover::before{background:var(--accent);}

/* ---- 装置下缘:五枚平台胶囊沿浅弧排开 ---- */
.arc{
  position:absolute;
  left:50%;
  top:calc(var(--orbit-top) + var(--orbit-size) - 92px);
  transform:translateX(-50%);
  z-index:3;
  display:flex;
  align-items:flex-start;
  gap:18px;
}

.cap{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1px;
  text-decoration:none;
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  padding:11px 27px 9px;
  box-shadow:var(--shadow-card);
  transition:transform .2s ease,border-color .2s ease;
  pointer-events:auto;
}

.arc .cap:nth-child(1),
.arc .cap:nth-child(5){margin-top:0;}
.arc .cap:nth-child(2),
.arc .cap:nth-child(4){margin-top:26px;}
.arc .cap:nth-child(3){margin-top:38px;}

.cap:hover{
  transform:translateY(-4px);
  border-color:var(--peach-deep);
}

.cap-name{
  font-size:15px;
  font-weight:600;
  color:var(--text);
  line-height:1.4;
  transition:color .2s ease;
}

.cap:hover .cap-name{color:var(--accent-dark);}

.cap-ver{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.03em;
  color:var(--text-muted);
  line-height:1.5;
}

/* ---- 下一分区露边 ---- */
.peek{
  position:relative;
  z-index:4;
  background:var(--bg-panel2);
  border-radius:var(--radius-xl) var(--radius-xl) 0 0;
  min-height:200px;
  padding-top:20px;
  padding-bottom:48px;
  text-align:center;
}

.peek-label{
  font-family:var(--font-display);
  font-size:15px;
  letter-spacing:.28em;
  color:var(--text-muted);
}

.peek-label::before,
.peek-label::after{
  content:"—";
  color:var(--peach-deep);
  margin:0 12px;
}

/* ============ 事实徽标带(静态事实,aria-hidden) ============ */
.fact-strip{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px 28px;
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.05em;
  color:var(--text-muted);
}

.fact-strip span{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.fact-strip span::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--peach-deep);
  flex-shrink:0;
}

/* ============ 「花瓣手记」单列错落特性卡组 ============ */
.petal-flow{
  display:flex;
  flex-direction:column;
  gap:26px;
  max-width:980px;
  margin-inline:auto;
}

.petal-card{
  display:flex;
  gap:26px;
  align-items:flex-start;
  background:var(--bg-panel);
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-card);
  padding:30px 34px;
  min-width:0;
}

.petal-card:nth-child(even){background:var(--bg-panel2);}

.petal-no{
  width:78px;
  height:78px;
  flex-shrink:0;
  border-radius:32px 32px 32px 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-display);
  font-size:30px;
  font-weight:700;
  color:var(--bg-panel);
}

.petal-no.p1{background:linear-gradient(135deg,var(--accent),var(--peach-deep));}
.petal-no.p2{background:linear-gradient(135deg,var(--accent-dark),var(--accent));}
.petal-no.p3{background:linear-gradient(135deg,var(--peach-deep),var(--peach));color:var(--accent-dark);}
.petal-no.p4{background:linear-gradient(135deg,var(--accent),var(--peach));}
.petal-no.p5{background:linear-gradient(135deg,var(--accent-dark),var(--peach-deep));}

.petal-body{min-width:0;}

.petal-body h3{
  font-family:var(--font-display);
  font-size:22px;
  margin-bottom:8px;
}

.petal-body p{
  color:var(--text-muted);
  font-size:15px;
}

@media (min-width:980px){
  .petal-card{width:88%;}
  .petal-card:nth-child(odd){margin-right:auto;}
  .petal-card:nth-child(even){margin-left:auto;}
}

/* ============ Tab 切换(role=tablist 配套) ============ */
.tabs-bar{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  padding:6px;
  width:fit-content;
  max-width:100%;
}

.tabs-bar [role="tab"]{
  border:0;
  background:transparent;
  font-family:var(--font-body);
  font-size:14.5px;
  font-weight:600;
  color:var(--text-muted);
  padding:9px 21px;
  min-height:40px;
  border-radius:var(--radius-pill);
  cursor:pointer;
  white-space:nowrap;
  transition:color .2s ease,background-color .2s ease;
}

.tabs-bar [role="tab"]:hover{color:var(--accent-dark);}

.tabs-bar [role="tab"][aria-selected="true"]{
  background:var(--accent);
  color:var(--bg-panel);
  box-shadow:var(--shadow-btn);
}

.tab-panel{
  margin-top:26px;
  min-width:0;
}

/* ============ 长页分类跳转导航(toc) ============ */
.toc-tabs{
  display:flex;
  gap:10px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  padding-top:6px;
  padding-bottom:14px;
  scrollbar-width:thin;
}

.toc-tabs a{
  flex-shrink:0;
  text-decoration:none;
  font-size:14px;
  color:var(--text-muted);
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  padding:8px 19px;
  transition:color .2s ease,border-color .2s ease;
}

.toc-tabs a:hover{
  color:var(--accent-dark);
  border-color:var(--peach-deep);
}

/* ============ FAQ 折叠项 ============ */
.faq-item{
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  overflow:hidden;
}

.faq-item + .faq-item{margin-top:14px;}

.faq-item summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:12px;
  padding:18px 22px;
  font-weight:600;
  color:var(--text);
}

.faq-item summary::-webkit-details-marker{display:none;}

.faq-item summary::after{
  content:"+";
  margin-left:auto;
  flex-shrink:0;
  font-size:23px;
  font-weight:400;
  color:var(--accent);
  line-height:1;
  transition:transform .25s ease;
}

.faq-item[open] summary::after{transform:rotate(45deg);}

.faq-body{
  padding-left:22px;
  padding-right:22px;
  padding-bottom:20px;
  color:var(--text-muted);
  font-size:15px;
}

.faq-body > * + *{margin-top:10px;}

/* ============ 术语卡 ============ */
.term-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:18px;
}

.term-grid > *{min-width:0;}

.term-card{
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  padding:20px 24px;
  min-width:0;
}

.term-name{
  font-family:var(--font-display);
  font-size:18px;
  font-weight:700;
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:10px;
}

.term-code{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.04em;
  color:var(--accent-dark);
  background:var(--bg-panel2);
  border-radius:var(--radius-pill);
  padding:2px 9px;
  max-width:100%;
  overflow:hidden;
  white-space:nowrap;
}

.term-desc{
  font-size:14.5px;
  color:var(--text-muted);
  margin-top:8px;
}

/* ============ 徽章(渲染动态文本必须自带宽度防御) ============ */
.badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  font-weight:600;
  padding:3px 12px;
  border-radius:var(--radius-pill);
  white-space:nowrap;
  max-width:100%;
  overflow:hidden;
}

.badge-hot{
  background:var(--accent);
  color:var(--bg-panel);
}

.badge-rec{
  background:var(--bg-panel2);
  color:var(--accent-dark);
}

.badge-dead{
  background:transparent;
  border:1px solid var(--border);
  color:var(--text-muted);
}

.badge-ok{
  background:transparent;
  border:1px solid var(--border);
  color:var(--ok);
}

/* ============ 下载客户端卡片 ============ */
.dl-card{
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-card);
  padding:26px 30px;
  min-width:0;
}

.dl-card + .dl-card{margin-top:20px;}

.dl-card.is-dead{
  background:var(--bg);
  box-shadow:none;
}

.dl-head{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px 14px;
}

.dl-ico{
  width:52px;
  height:52px;
  flex-shrink:0;
}

.dl-name{
  font-family:var(--font-display);
  font-size:22px;
  font-weight:700;
  margin-right:auto;
}

.dl-ver{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.03em;
  color:var(--text-muted);
}

/* 版本占位防呆:数据为空时整个槽位不可见,由 downloads.js 填充后才显示 */
[data-cdnver]:empty{display:none;}

.dl-desc{
  color:var(--text-muted);
  font-size:15px;
  margin-top:12px;
}

.dl-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:18px;
}

.dl-note{
  font-size:13px;
  color:var(--text-muted);
  margin-top:12px;
}

/* ============ 博客文章卡 ============ */
.post-card{
  display:block;
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-card);
  padding:26px 30px;
  text-decoration:none;
  color:inherit;
  min-width:0;
  transition:transform .2s ease,border-color .2s ease;
}

.post-card:hover{
  transform:translateY(-4px);
  border-color:var(--peach-deep);
  color:inherit;
}

.post-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  font-size:12.5px;
  color:var(--text-muted);
}

.post-date{
  font-family:var(--font-mono);
  letter-spacing:.03em;
}

.post-tag{
  display:inline-block;
  font-size:12px;
  color:var(--accent-dark);
  background:var(--bg-panel2);
  border-radius:var(--radius-pill);
  padding:2px 11px;
  max-width:100%;
  overflow:hidden;
  white-space:nowrap;
}

.post-title{
  font-family:var(--font-display);
  font-size:20px;
  font-weight:700;
  margin-top:10px;
  transition:color .2s ease;
}

.post-card:hover .post-title{color:var(--accent-dark);}

.post-sum{
  font-size:14.5px;
  color:var(--text-muted);
  margin-top:8px;
}

.post-more{
  display:inline-block;
  font-size:14px;
  color:var(--accent);
  margin-top:12px;
}

.post-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:20px;
}

.post-grid > *{min-width:0;}

/* ============ Callout 引用块 ============ */
.callout{
  background:var(--bg-panel2);
  border-left:4px solid var(--peach-deep);
  border-radius:var(--radius-md);
  padding:16px 20px;
  margin-top:1.4em;
  margin-bottom:1.4em;
  font-size:15px;
  color:var(--text);
}

.callout > * + *{margin-top:8px;}

.callout-warn{border-left-color:var(--warn);}
.callout-ok{border-left-color:var(--ok);}
.callout-bad{border-left-color:var(--bad);}

/* ============ 表格 ============ */
.table-wrap{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  max-width:100%;
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
}

.data-table{
  border-collapse:collapse;
  width:100%;
  min-width:520px;
  font-size:14.5px;
}

.data-table th{
  text-align:left;
  font-weight:600;
  background:var(--bg-panel2);
  color:var(--text);
  padding:12px 16px;
  white-space:nowrap;
}

.data-table td{
  padding:11px 16px;
  border-top:1px solid var(--border);
  color:var(--text-muted);
}

/* 裸表格防御:写手若输出不带 .table-wrap 的 .data-table,自动降级为可横滑块 */
.prose > .data-table{
  display:block;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  max-width:100%;
  min-width:0;
}

/* ============ 正文排版(教程/深文档/博客) ============ */
.prose{
  max-width:820px;
  min-width:0;
}

.prose h2{
  font-size:clamp(25px,3vw,32px);
  margin-top:2.1em;
  margin-bottom:.6em;
}

.prose h3{
  font-size:clamp(18px,2vw,21px);
  margin-top:1.7em;
  margin-bottom:.5em;
}

.prose p{margin-bottom:1.1em;}

.prose ul{
  list-style:none;
  margin-bottom:1.2em;
}

.prose ul > li{
  position:relative;
  padding-left:22px;
  margin-bottom:8px;
}

.prose ul > li::before{
  content:"";
  position:absolute;
  left:4px;
  top:.62em;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--peach-deep);
}

.prose ol{
  list-style:none;
  counter-reset:pstep;
  margin-bottom:1.2em;
}

.prose ol > li{
  counter-increment:pstep;
  position:relative;
  padding-left:44px;
  margin-bottom:14px;
}

.prose ol > li::before{
  content:counter(pstep);
  position:absolute;
  left:0;
  top:1px;
  width:28px;
  height:28px;
  border-radius:50%;
  background:var(--bg-panel2);
  color:var(--accent-dark);
  font-family:var(--font-display);
  font-weight:700;
  font-size:15px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.prose pre{
  background:var(--bg-panel2);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:18px 22px;
  font-size:13.5px;
  line-height:1.75;
  margin-bottom:1.3em;
}

.prose code{
  font-size:.88em;
  background:var(--bg-panel2);
  border-radius:6px;
  padding:2px 7px;
}

.prose pre code{
  background:transparent;
  padding:0;
}

.prose blockquote{
  border-left:4px solid var(--peach-deep);
  background:var(--bg-panel2);
  border-radius:var(--radius-md);
  padding:14px 20px;
  color:var(--text-muted);
  margin-bottom:1.3em;
}

.prose a{color:var(--accent);}
.prose a:hover{color:var(--accent-dark);}

/* ============ 面包屑(博客文章页) ============ */
.crumbs{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  font-size:13px;
  color:var(--text-muted);
  margin-top:1.4rem;
}

.crumbs li{display:flex;align-items:center;gap:6px;min-width:0;}

.crumbs li + li::before{
  content:"/";
  color:var(--border);
}

.crumbs a{
  color:var(--text-muted);
  text-decoration:none;
  transition:color .2s ease;
}

.crumbs a:hover{color:var(--accent);}

/* ============ 文末下载引导卡 ============ */
.dl-guide{
  background:linear-gradient(135deg,var(--bg-panel2),var(--bg-panel));
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-card);
  padding:32px 34px;
  text-align:center;
  margin-top:3em;
}

.dl-guide h2{
  font-size:clamp(22px,2.6vw,27px);
  margin-bottom:10px;
}

.dl-guide p{
  color:var(--text-muted);
  font-size:15px;
  max-width:560px;
  margin-inline:auto;
}

.dl-guide-cta{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:14px;
  margin-top:22px;
}

/* ============ 右下角常驻下载浮层 ============ */
.dl-fab{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:80;
  display:inline-flex;
  align-items:center;
  gap:9px;
  background:var(--accent);
  color:var(--bg-panel);
  text-decoration:none;
  font-size:14.5px;
  font-weight:600;
  padding:12px 22px;
  border-radius:var(--radius-pill);
  box-shadow:var(--shadow-btn);
  transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease;
}

.dl-fab:hover{
  background:var(--accent-dark);
  color:var(--bg-panel);
  transform:translateY(-2px);
  box-shadow:var(--shadow-btn-hover);
}

.dl-fab svg{
  width:16px;
  height:16px;
  flex-shrink:0;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* ============ 快速上手预览小步卡 ============ */
.mini-steps{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:18px;
  counter-reset:mstep;
}

.mini-steps > *{min-width:0;}

.mini-step{
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  padding:22px 24px;
  counter-increment:mstep;
}

.mini-step::before{
  content:counter(mstep,decimal-leading-zero);
  display:block;
  font-family:var(--font-display);
  font-size:26px;
  font-weight:700;
  color:var(--accent);
  margin-bottom:8px;
}

.mini-step h3{font-size:17px;margin-bottom:6px;}

.mini-step p{
  font-size:14px;
  color:var(--text-muted);
}

/* ============ 首页下载入口平台格 ============ */
.tile-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:14px;
}

.tile-grid > *{min-width:0;}

.tile{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:5px;
  text-decoration:none;
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  padding:22px 14px 18px;
  transition:transform .2s ease,border-color .2s ease;
}

.tile:hover{
  transform:translateY(-4px);
  border-color:var(--peach-deep);
}

.tile-name{
  font-size:15px;
  font-weight:600;
  color:var(--text);
}

.tile:hover .tile-name{color:var(--accent-dark);}

.tile-go{
  font-size:12.5px;
  color:var(--text-muted);
}

/* ============ 响应式 ============ */
@media (max-width:1100px){
  .arc{gap:10px;}
  .cap{padding:10px 18px 8px;}
}

@media (max-width:760px){
  .hero{height:auto;min-height:0;padding-bottom:40px;}

  .hero-stage{
    position:relative;
    left:auto;
    top:auto;
    transform:none;
    margin:26px auto 0;
    width:min(76vw,340px);
    height:min(76vw,340px);
  }

  .hero::before{
    top:46%;
    width:130vmin;
    max-width:100%;
    height:130vmin;
  }

  .hero-copy{padding-top:34px;}

  .hero-cta{flex-wrap:wrap;}

  .arc{
    position:static;
    transform:none;
    flex-wrap:wrap;
    justify-content:center;
    margin-top:22px;
    padding-left:var(--gutter);
    padding-right:var(--gutter);
  }

  .arc .cap,
  .arc .cap:nth-child(2),
  .arc .cap:nth-child(3),
  .arc .cap:nth-child(4){margin-top:0;}

  .petal-card{
    flex-direction:column;
    gap:16px;
    padding:24px 20px;
  }

  .petal-no{width:60px;height:60px;font-size:24px;border-radius:24px 24px 24px 10px;}

  .dl-card{padding:22px 18px;}

  .post-card{padding:22px 20px;}

  .dl-guide{padding:26px 20px;}

  .dl-fab{
    right:12px;
    bottom:12px;
    padding:11px 18px;
    font-size:14px;
  }
}

/* ============ 动效降级 ============ */
@media (prefers-reduced-motion:reduce){
  .orbit .spin,
  .orbit .drift,
  .tag-hold,
  .emblem{animation:none;}
  .cap,.tile,.post-card,.dl-fab,.chip-row a{transition:none;}
}