/* ===== 仪式感样式：触碰开场 + 行业符号 + 递进揭示 ===== */

/* --- 触碰开场遮罩 --- */
.ceremony-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: radial-gradient(circle at 50% 45%, var(--ceremony-a, #173d74) 0%, #0a0e1a 70%);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  opacity: 1; transition: opacity 0.6s ease;
  pointer-events: auto;
}
.ceremony-overlay.fade-out { opacity: 0; pointer-events: none; }

.ceremony-ripple {
  position: absolute; width: 120px; height: 120px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.4);
  animation: ceremony-ripple-expand 1.6s ease-out infinite;
}
.ceremony-ripple:nth-child(2) { animation-delay: 0.5s; }
.ceremony-ripple:nth-child(3) { animation-delay: 1.0s; }
@keyframes ceremony-ripple-expand {
  0% { transform: scale(0.3); opacity: 0.8; }
  100% { transform: scale(3.5); opacity: 0; }
}

.ceremony-symbol-wrap {
  position: relative; width: 100px; height: 100px;
  display: flex; align-items: center; justify-content: center;
  animation: ceremony-symbol-in 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}
@keyframes ceremony-symbol-in {
  0% { transform: scale(0) rotate(-30deg); opacity: 0; }
  100% { transform: scale(1) rotate(0); opacity: 1; }
}

.ceremony-label {
  margin-top: 24px; color: #fff; font-size: 16px; font-weight: 600;
  letter-spacing: 2px; opacity: 0; animation: ceremony-label-in 0.5s ease 0.6s both;
}
.ceremony-hint {
  margin-top: 8px; color: rgba(255,255,255,0.6); font-size: 12px;
  opacity: 0; animation: ceremony-label-in 0.5s ease 0.9s both;
}
@keyframes ceremony-label-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* --- 12 个行业仪式符号（纯 CSS） --- */
.cs { position: relative; width: 64px; height: 64px; }

/* weave 非遗：织纹流动 */
.cs-weave { background: repeating-linear-gradient(45deg, var(--ceremony-b, #ad6039) 0 4px, transparent 4px 8px), repeating-linear-gradient(-45deg, var(--ceremony-b, #ad6039) 0 4px, transparent 4px 8px); border-radius: 8px; animation: cs-weave-flow 2s linear infinite; }
@keyframes cs-weave-flow { 0% { background-position: 0 0, 0 0; } 100% { background-position: 24px 24px, -24px 24px; } }

/* gear 商品：齿轮转动 */
.cs-gear::before { content: ''; position: absolute; inset: 8px; border-radius: 50%; border: 4px solid var(--ceremony-b, #3b8a78); border-top-color: transparent; animation: cs-gear-spin 1.5s linear infinite; }
.cs-gear::after { content: ''; position: absolute; inset: 24px; border-radius: 50%; background: var(--ceremony-b, #3b8a78); }
@keyframes cs-gear-spin { to { transform: rotate(360deg); } }

/* store 商家：招牌灯亮 */
.cs-store { background: var(--ceremony-b, #d06f3e); border-radius: 6px; animation: cs-store-glow 1.8s ease-in-out infinite; }
.cs-store::before { content: ''; position: absolute; top: 50%; left: 10%; right: 10%; height: 3px; background: #fff; transform: translateY(-50%); }
@keyframes cs-store-glow { 0%, 100% { box-shadow: 0 0 8px var(--ceremony-b, #d06f3e); } 50% { box-shadow: 0 0 24px var(--ceremony-b, #d06f3e), 0 0 48px rgba(208,111,62,0.4); } }

/* sprout 农特：生长粒子 */
.cs-sprout::before { content: ''; position: absolute; bottom: 8px; left: 50%; width: 4px; height: 0; background: var(--ceremony-b, #b38230); transform: translateX(-50%); animation: cs-sprout-grow 1.5s ease-out infinite; }
.cs-sprout::after { content: ''; position: absolute; bottom: 28px; left: 50%; width: 20px; height: 12px; border-radius: 50% 0 50% 0; background: #5a8a3a; transform: translateX(-80%) rotate(-30deg); opacity: 0; animation: cs-sprout-leaf 1.5s ease-out infinite; }
@keyframes cs-sprout-grow { 0% { height: 0; } 60% { height: 36px; } 100% { height: 36px; } }
@keyframes cs-sprout-leaf { 0%, 40% { opacity: 0; } 60%, 100% { opacity: 1; } }

/* gift 文创：礼盒打开 */
.cs-gift { background: var(--ceremony-b, #c8913b); border-radius: 4px; }
.cs-gift::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 40%; background: var(--ceremony-a, #7e3c62); border-radius: 4px 4px 0 0; transform-origin: top; animation: cs-gift-open 1.8s ease-in-out infinite; }
.cs-gift::after { content: ''; position: absolute; top: 30%; left: 50%; width: 6px; height: 70%; background: #fff; transform: translateX(-50%); }
@keyframes cs-gift-open { 0%, 30% { transform: rotateX(0); } 60%, 100% { transform: rotateX(-110deg); } }

/* ripple 茶酒：涟漪 */
.cs-ripple { border-radius: 50%; border: 3px solid var(--ceremony-b, #a8873b); }
.cs-ripple::before, .cs-ripple::after { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--ceremony-b, #a8873b); animation: cs-ripple-wave 2s ease-out infinite; }
.cs-ripple::after { animation-delay: 1s; }
@keyframes cs-ripple-wave { 0% { transform: scale(0.5); opacity: 1; } 100% { transform: scale(1.8); opacity: 0; } }

/* diamond 珠宝：光泽折射 */
.cs-diamond { background: linear-gradient(135deg, var(--ceremony-b, #8b6f9e), #fff, var(--ceremony-b, #8b6f9e)); clip-path: polygon(50% 0%, 100% 35%, 80% 100%, 20% 100%, 0% 35%); animation: cs-diamond-shine 2s linear infinite; background-size: 200% 100%; }
@keyframes cs-diamond-shine { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* spotlight 展馆：聚光灯 */
.cs-spotlight { background: #1a1a2e; border-radius: 50%; overflow: hidden; }
.cs-spotlight::before { content: ''; position: absolute; top: -50%; left: 50%; width: 40px; height: 120px; background: linear-gradient(to bottom, rgba(255,255,200,0.6), transparent); transform-origin: top center; animation: cs-spotlight-sweep 2s ease-in-out infinite; }
@keyframes cs-spotlight-sweep { 0%, 100% { transform: translateX(-50%) rotate(-25deg); } 50% { transform: translateX(-50%) rotate(25deg); } }

/* heart 玩偶：心跳 */
.cs-heart::before { content: ''; position: absolute; inset: 12px; background: var(--ceremony-b, #7a57c8); clip-path: path('M32 56 C16 42 4 30 4 18 C4 8 12 2 20 2 C26 2 30 6 32 10 C34 6 38 2 44 2 C52 2 60 8 60 18 C60 30 48 42 32 56 Z'); transform: scale(0.9); animation: cs-heart-beat 1.2s ease-in-out infinite; }
@keyframes cs-heart-beat { 0%, 100% { transform: scale(0.9); } 15% { transform: scale(1.1); } 30% { transform: scale(0.95); } 45% { transform: scale(1.05); } }

/* orbit 人物故事：星轨 */
.cs-orbit { border-radius: 50%; border: 1px solid rgba(42,156,161,0.3); }
.cs-orbit::before { content: ''; position: absolute; inset: 8px; border-radius: 50%; border: 1px solid rgba(42,156,161,0.5); animation: cs-orbit-rotate 8s linear infinite; }
.cs-orbit::after { content: ''; position: absolute; top: 4px; left: 50%; width: 8px; height: 8px; border-radius: 50%; background: #2a9ca1; box-shadow: 0 0 8px #2a9ca1; transform: translateX(-50%); animation: cs-orbit-dot 4s linear infinite; }
@keyframes cs-orbit-rotate { to { transform: rotate(360deg); } }
@keyframes cs-orbit-dot { from { transform: translateX(-50%) rotate(0) translateY(-26px) rotate(0); } to { transform: translateX(-50%) rotate(360deg) translateY(-26px) rotate(-360deg); } }

/* book 图书：翻页 */
.cs-book { background: var(--ceremony-b, #f28a3d); border-radius: 2px 6px 6px 2px; }
.cs-book::before { content: ''; position: absolute; top: 4px; bottom: 4px; left: 50%; width: 2px; background: rgba(0,0,0,0.2); }
.cs-book::after { content: ''; position: absolute; top: 4px; bottom: 4px; right: 4px; left: 52%; background: #fff; transform-origin: left; animation: cs-book-flip 2s ease-in-out infinite; }
@keyframes cs-book-flip { 0%, 30% { transform: rotateY(0); } 70%, 100% { transform: rotateY(-160deg); } }

/* flower 教师节：花朵绽放（复用 festival 样式，这里给简化版） */
.cs-flower { position: relative; }
.cs-flower::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle, #e79a42 0%, #7c315f 100%); border-radius: 50%; animation: cs-flower-bloom 2s ease-in-out infinite; }
@keyframes cs-flower-bloom { 0%, 100% { transform: scale(0.85); } 50% { transform: scale(1.05); } }

/* --- 递进式内容揭示 --- */
.reveal-item {
  opacity: 0; transform: translateY(20px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.reveal-item.revealed {
  opacity: 1; transform: translateY(0);
}

/* 公开页首屏仪式感增强 */
.public-ceremony-hero {
  position: relative; overflow: hidden;
  padding: 48px 20px 32px; text-align: center;
  background: linear-gradient(160deg, var(--ceremony-a, #173d74) 0%, var(--ceremony-b, #ad6039) 100%);
  color: #fff;
}
.public-ceremony-hero .cs {
  margin: 0 auto 16px; width: 72px; height: 72px;
  filter: drop-shadow(0 4px 12px rgba(0,0,0,0.3));
}
.public-ceremony-hero h1 {
  font-size: 22px; font-weight: 700; margin: 0 0 8px;
  text-shadow: 0 2px 8px rgba(0,0,0,0.3);
}
.public-ceremony-hero p {
  font-size: 14px; opacity: 0.9; margin: 0; line-height: 1.6;
}

/* 复碰微变化：问候语轮换 */
.ceremony-greeting {
  display: inline-block; min-height: 20px;
  transition: opacity 0.3s ease;
}
.ceremony-greeting.switching { opacity: 0; }

/* 链接组样式 */
.link-group-editor { margin-top: 12px; }
.link-group-item {
  display: flex; align-items: center; gap: 8px;
  padding: 8px; border: 1px solid #e4e3dd; border-radius: 8px;
  margin-bottom: 8px; background: #fafaf7;
}
.link-group-item select, .link-group-item input {
  padding: 6px 8px; border: 1px solid #d4d3cc; border-radius: 6px;
  font-size: 13px;
}
.link-group-item input[type="url"] { flex: 1; min-width: 0; }
.link-group-item .link-remove {
  background: none; border: none; color: #ea6668; cursor: pointer;
  font-size: 16px; padding: 4px 8px;
}
.link-add-btn {
  width: 100%; padding: 8px; border: 1px dashed #c4c3bc; border-radius: 8px;
  background: none; color: #6b7280; cursor: pointer; font-size: 13px;
}
.link-add-btn:hover { border-color: var(--ceremony-a, #173d74); color: var(--ceremony-a, #173d74); }

/* 公开页链接组展示 */
.public-link-group {
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
  padding: 16px 20px;
}
.public-link-group a {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; border-radius: 20px; font-size: 13px;
  text-decoration: none; color: #fff;
  background: var(--ceremony-a, #173d74);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.public-link-group a:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.15); }
.public-link-group a.platform-link { background: #e79a42; }

/* touch 模式引导 */
.touch-flow-guide {
  display: flex; justify-content: center; gap: 4px;
  padding: 12px 16px; background: #f4f3ee;
}
.touch-flow-step {
  flex: 1; max-width: 80px; text-align: center;
  font-size: 11px; color: #6b7280; padding: 6px 4px;
  border-radius: 6px; transition: all 0.3s ease;
}
.touch-flow-step.active {
  background: var(--ceremony-a, #173d74); color: #fff; font-weight: 600;
}
.touch-flow-step.done {
  background: #52c41a; color: #fff;
}
.touch-flow-step .step-num {
  display: block; font-size: 16px; font-weight: 700; margin-bottom: 2px;
}

/* 低动态偏好兼容 */
@media (prefers-reduced-motion: reduce) {
  .ceremony-ripple, .cs, .cs::before, .cs::after {
    animation: none !important;
  }
  .ceremony-overlay { transition: none; }
  .reveal-item { opacity: 1; transform: none; transition: none; }
}