/* ============================================================
   registerv2.css — Register Type Selection
   居中卡片式布局 · 波浪渐变 · 与登录页完全不同
   ============================================================ */

body.reg-page {
	margin: 0;
	padding: 0;
	min-height: 100vh;
	overflow-x: hidden;
	background: #f8f9fc;
	font-family: "Microsoft YaHei", "PingFang SC", -apple-system, BlinkMacSystemFont, sans-serif;
	color: #1a1a2e;
	-webkit-font-smoothing: antialiased;
}

body.reg-page * {
	box-sizing: border-box;
}

/* ---------- 背景装饰 ---------- */
.reg-bg {
	position: fixed;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	pointer-events: none;
	background: linear-gradient(160deg, #fefefe 0%, #f5f0ff 35%, #fff5f7 70%, #f0f4ff 100%);
}

.reg-mesh {
	position: absolute;
	border-radius: 50%;
	filter: blur(70px);
	animation: reg-mesh-float ease-in-out infinite alternate;
}

.reg-mesh-1 {
	width: 50vw;
	height: 50vw;
	max-width: 520px;
	max-height: 520px;
	top: -12%;
	right: -8%;
	background: radial-gradient(circle, rgba(255, 160, 180, 0.35) 0%, transparent 70%);
	animation-duration: 14s;
}

.reg-mesh-2 {
	width: 40vw;
	height: 40vw;
	max-width: 420px;
	max-height: 420px;
	bottom: -8%;
	left: -6%;
	background: radial-gradient(circle, rgba(160, 180, 255, 0.3) 0%, transparent 70%);
	animation-duration: 16s;
	animation-delay: -4s;
}

.reg-mesh-3 {
	width: 30vw;
	height: 30vw;
	max-width: 320px;
	max-height: 320px;
	top: 40%;
	left: 40%;
	background: radial-gradient(circle, rgba(255, 200, 210, 0.25) 0%, transparent 70%);
	animation-duration: 12s;
	animation-delay: -2s;
}

@keyframes reg-mesh-float {
	0%   { transform: translate(0, 0) scale(1); }
	100% { transform: translate(2%, -3%) scale(1.05); }
}

/* 极光 — 增强可见度 */
.reg-aurora {
	position: absolute;
	border-radius: 50%;
	filter: blur(50px);
	pointer-events: none;
	opacity: 0.9;
}

.reg-aurora-1 {
	width: 55vw;
	height: 45vh;
	top: -5%;
	left: -5%;
	background: linear-gradient(135deg,
		rgba(255, 100, 140, 0.55) 0%,
		rgba(255, 170, 195, 0.35) 45%,
		rgba(200, 210, 255, 0.2) 80%,
		transparent 100%);
	animation: reg-aurora-1 9s ease-in-out infinite alternate;
	transform: rotate(-12deg);
}

.reg-aurora-2 {
	width: 50vw;
	height: 40vh;
	top: 20%;
	left: 15%;
	background: linear-gradient(150deg,
		transparent 0%,
		rgba(255, 80, 120, 0.45) 30%,
		rgba(255, 150, 175, 0.3) 55%,
		rgba(180, 190, 255, 0.2) 80%,
		transparent 100%);
	animation: reg-aurora-2 11s ease-in-out infinite alternate;
	transform: rotate(5deg);
}

.reg-aurora-3 {
	width: 42vw;
	height: 38vh;
	top: 5%;
	right: -5%;
	background: linear-gradient(200deg,
		rgba(255, 120, 150, 0.4) 0%,
		rgba(220, 160, 255, 0.25) 50%,
		rgba(160, 200, 255, 0.15) 75%,
		transparent 100%);
	animation: reg-aurora-3 10s ease-in-out infinite alternate;
}

@keyframes reg-aurora-1 {
	0%   { transform: rotate(-12deg) translateX(0) scaleY(1); opacity: 0.75; }
	100% { transform: rotate(-8deg) translateX(5%) scaleY(1.1); opacity: 1; }
}

@keyframes reg-aurora-2 {
	0%   { transform: rotate(5deg) translateY(0); opacity: 0.7; }
	100% { transform: rotate(8deg) translateY(-4%); opacity: 0.95; }
}

@keyframes reg-aurora-3 {
	0%   { transform: translateX(0); opacity: 0.65; }
	100% { transform: translateX(-5%); opacity: 0.9; }
}

/* 星空 */
.reg-stars {
	position: absolute;
	inset: 0;
	background-image:
		radial-gradient(2px 2px at 10% 15%, rgba(216, 39, 62, 0.3) 0%, transparent 100%),
		radial-gradient(1.5px 1.5px at 25% 40%, rgba(100, 130, 220, 0.25) 0%, transparent 100%),
		radial-gradient(2px 2px at 50% 10%, rgba(216, 39, 62, 0.2) 0%, transparent 100%),
		radial-gradient(1.5px 1.5px at 70% 35%, rgba(150, 170, 230, 0.3) 0%, transparent 100%),
		radial-gradient(2px 2px at 85% 60%, rgba(216, 39, 62, 0.15) 0%, transparent 100%),
		radial-gradient(1.5px 1.5px at 40% 70%, rgba(100, 130, 220, 0.2) 0%, transparent 100%);
	animation: reg-stars-twinkle 4s ease-in-out infinite alternate;
}

@keyframes reg-stars-twinkle {
	0%   { opacity: 0.5; }
	100% { opacity: 1; }
}

/* 底部波浪 */
.reg-wave {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 200px;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='rgba(216,39,62,0.04)' d='M0,64 C360,120 720,0 1080,64 C1260,96 1380,80 1440,64 L1440,120 L0,120 Z'/%3E%3C/svg%3E") bottom center / 100% 100% no-repeat;
	opacity: 0.8;
}

/* 旧漂浮圆点隐藏 */
.reg-orbit-dot {
	display: none;
}

/* ---------- 主容器 ---------- */
.reg-wrap {
	position: relative;
	z-index: 1;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	max-width: 1080px;
	margin: 0 auto;
	padding: 0 32px;
}

/* ---------- 顶栏 ---------- */
.reg-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 28px 0 20px;
}

.reg-logo img {
	max-height: 42px;
	width: auto;
}

.reg-header-login {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 20px;
	border-radius: 24px;
	font-size: 14px;
	font-weight: 500;
	color: #d8273e;
	text-decoration: none;
	background: rgba(216, 39, 62, 0.06);
	border: 1px solid rgba(216, 39, 62, 0.12);
	transition: background 0.2s, transform 0.2s;
}

.reg-header-login svg {
	width: 16px;
	height: 16px;
}

.reg-header-login:hover {
	background: rgba(216, 39, 62, 0.12);
	transform: translateX(2px);
}

/* ---------- 主内容 ---------- */
.reg-main {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 20px 0 60px;
	width: 100%;
}

/* Hero */
.reg-hero {
	text-align: center;
	margin-bottom: 40px;
	animation: reg-fade-up 0.7s ease-out both;
}

.reg-hero-badge {
	display: inline-block;
	padding: 5px 18px;
	border-radius: 20px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 3px;
	color: #d8273e;
	background: linear-gradient(135deg, rgba(216, 39, 62, 0.08), rgba(255, 150, 170, 0.12));
	margin-bottom: 16px;
}

.reg-hero-title {
	font-size: 44px;
	font-weight: 800;
	line-height: 1.25;
	margin: 0 0 14px;
	color: #1a1a2e;
	letter-spacing: -1px;
}

.reg-hero-title em {
	font-style: normal;
	background: linear-gradient(135deg, #d8273e, #ff6b8a);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.reg-hero-desc {
	font-size: 16px;
	color: #6b7280;
	margin: 0;
	max-width: 480px;
	line-height: 1.7;
}

/* 精致步骤条 — 拉长版 */
.reg-steps-bar {
	position: relative;
	width: 100%;
	max-width: 100%;
	margin-bottom: 40px;
	padding: 32px 60px 28px;
	background: rgba(255, 255, 255, 0.8);
	backdrop-filter: blur(16px);
	border: 1px solid rgba(255, 255, 255, 0.9);
	border-radius: 20px;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.05);
	animation: reg-fade-up 0.7s ease-out 0.1s both;
}

.reg-steps-track {
	position: absolute;
	top: 56px;
	left: 100px;
	right: 100px;
	height: 4px;
	background: #eef0f4;
	border-radius: 4px;
	overflow: hidden;
}

.reg-steps-progress {
	height: 100%;
	width: 16.66%;
	border-radius: 4px;
	background: linear-gradient(90deg, #e8455c, #d8273e, #ff6b8a, #e8455c);
	background-size: 300% 100%;
	animation: reg-progress-shine 3s ease-in-out infinite;
	box-shadow: 0 0 12px rgba(216, 39, 62, 0.3);
}

@keyframes reg-progress-shine {
	0%, 100% { background-position: 0% 50%; }
	50%      { background-position: 100% 50%; }
}

.reg-steps-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: space-between;
	position: relative;
	z-index: 1;
}

.reg-step-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	flex: 1;
}

.reg-step-circle {
	position: relative;
	width: 52px;
	height: 52px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #f3f4f6;
	border: 2px solid #e5e7eb;
	color: #9ca3af;
	transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.reg-step-circle svg {
	width: 20px;
	height: 20px;
}

.reg-step-pulse {
	position: absolute;
	inset: -6px;
	border-radius: 50%;
	border: 2px solid rgba(216, 39, 62, 0.4);
	animation: reg-step-pulse 2s ease-out infinite;
}

@keyframes reg-step-pulse {
	0%   { transform: scale(1); opacity: 0.8; }
	100% { transform: scale(1.4); opacity: 0; }
}

.reg-step-label {
	font-size: 14px;
	font-weight: 500;
	color: #9ca3af;
	text-align: center;
	white-space: nowrap;
	transition: color 0.3s;
	letter-spacing: 0.5px;
}

.reg-step-active .reg-step-circle {
	background: linear-gradient(135deg, #e8455c, #d8273e);
	border-color: transparent;
	color: #fff;
	box-shadow: 0 4px 16px rgba(216, 39, 62, 0.35);
	transform: scale(1.08);
}

.reg-step-active .reg-step-label {
	color: #1a1a2e;
	font-weight: 700;
}

/* ---------- 左上角 3D 场景 ---------- */
.reg-3d-scene {
	position: fixed;
	top: 88px;
	left: 24px;
	z-index: 5;
	pointer-events: none;
	width: 200px;
	height: 200px;
	animation: reg-fade-up 0.8s ease-out both;
}

.reg-3d-stage {
	width: 200px;
	height: 200px;
	display: flex;
	align-items: center;
	justify-content: center;
	perspective: 700px;
}

.reg-orbit-system {
	position: relative;
	width: 160px;
	height: 160px;
	transform-style: preserve-3d;
	animation: reg-system-tilt 14s ease-in-out infinite alternate;
}

@keyframes reg-system-tilt {
	0%   { transform: rotateX(10deg) rotateY(-15deg); }
	100% { transform: rotateX(14deg) rotateY(20deg); }
}

.reg-core-glow {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 90px;
	height: 90px;
	margin: -45px 0 0 -45px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255, 150, 170, 0.5) 0%, rgba(216, 39, 62, 0.1) 70%, transparent 100%);
	animation: reg-core-pulse 3.5s ease-in-out infinite alternate;
}

.reg-core-sphere {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 36px;
	height: 36px;
	margin: -18px 0 0 -18px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #ff8fa3, #d8273e 55%, #a01830);
	box-shadow: 0 0 24px rgba(216, 39, 62, 0.45), 0 0 48px rgba(255, 120, 150, 0.2);
	animation: reg-core-spin 10s linear infinite;
}

@keyframes reg-core-pulse {
	0%   { transform: scale(1); opacity: 0.7; }
	100% { transform: scale(1.12); opacity: 1; }
}

@keyframes reg-core-spin {
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}

.reg-orbit-wrap {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 0;
	height: 0;
	transform-style: preserve-3d;
}

.reg-orbit-ring {
	position: absolute;
	top: 50%;
	left: 50%;
	border-radius: 50%;
	border: 2px solid transparent;
	transform-style: preserve-3d;
}

.reg-orbit-node {
	position: absolute;
	top: 50%;
	left: 50%;
	border-radius: 50%;
	transform-style: preserve-3d;
}

.reg-orbit-wrap-1 { animation: reg-orbit-y 12s linear infinite; }
.reg-orbit-wrap-1 .reg-orbit-ring {
	width: 130px; height: 130px;
	margin: -65px 0 0 -65px;
	border-color: rgba(216, 39, 62, 0.35);
	box-shadow: 0 0 8px rgba(216, 39, 62, 0.12);
	transform: rotateX(72deg);
}
.reg-orbit-wrap-1 .reg-orbit-node {
	width: 8px; height: 8px;
	margin: -65px 0 0 -4px;
	background: #d8273e;
	box-shadow: 0 0 8px rgba(216, 39, 62, 0.6);
	transform: rotateX(72deg) translateY(-65px);
}

.reg-orbit-wrap-2 { animation: reg-orbit-y 8s linear infinite reverse; }
.reg-orbit-wrap-2 .reg-orbit-ring {
	width: 100px; height: 100px;
	margin: -50px 0 0 -50px;
	border-color: rgba(255, 120, 150, 0.4);
	transform: rotateX(55deg) rotateY(50deg);
}
.reg-orbit-wrap-2 .reg-orbit-node {
	width: 6px; height: 6px;
	margin: -50px 0 0 -3px;
	background: #ff6b8a;
	box-shadow: 0 0 6px rgba(255, 107, 138, 0.6);
	transform: rotateX(55deg) rotateY(50deg) translateY(-50px);
}

.reg-orbit-wrap-3 { animation: reg-orbit-z 16s linear infinite; }
.reg-orbit-wrap-3 .reg-orbit-ring {
	width: 150px; height: 150px;
	margin: -75px 0 0 -75px;
	border: 1px dashed rgba(100, 130, 220, 0.3);
	transform: rotateX(85deg);
}
.reg-orbit-wrap-3 .reg-orbit-node {
	width: 5px; height: 5px;
	margin: -75px 0 0 -2.5px;
	background: #8ba4e8;
	transform: rotateX(85deg) translateY(-75px);
}

@keyframes reg-orbit-y {
	from { transform: rotateY(0deg); }
	to   { transform: rotateY(360deg); }
}

@keyframes reg-orbit-z {
	from { transform: rotateZ(0deg); }
	to   { transform: rotateZ(360deg); }
}

.reg-float-cube {
	position: absolute;
	border: 1.5px solid rgba(216, 39, 62, 0.35);
	background: rgba(255, 255, 255, 0.5);
	animation: reg-cube-float ease-in-out infinite;
}

.reg-float-cube-1 { width: 14px; height: 14px; top: 0; right: 10%; animation-duration: 6s; }
.reg-float-cube-2 { width: 10px; height: 10px; bottom: 10%; left: 5%; animation-duration: 8s; animation-delay: -2s; border-color: rgba(100, 130, 220, 0.35); }
.reg-float-cube-3 { width: 8px; height: 8px; top: 20%; left: 0; animation-duration: 7s; animation-delay: -4s; }

@keyframes reg-cube-float {
	0%, 100% { transform: translateY(0) rotate(45deg); opacity: 0.5; }
	50%      { transform: translateY(-14px) rotate(90deg); opacity: 1; }
}

/* 旧步骤条隐藏 */
.reg-steps,
.reg-step,
.reg-step-line {
	display: none;
}

/* 选择卡片 */
.reg-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	width: 100%;
	max-width: 900px;
	animation: reg-fade-up 0.7s ease-out 0.2s both;
}

.reg-card {
	position: relative;
	display: block;
	text-decoration: none;
	color: inherit;
	border-radius: 20px;
	overflow: hidden;
	transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.35s;
}

.reg-card-glow {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity 0.35s;
	border-radius: 20px;
}

.reg-card-person .reg-card-glow {
	background: linear-gradient(135deg, rgba(216, 39, 62, 0.08), rgba(255, 150, 170, 0.05));
}

.reg-card-store .reg-card-glow {
	background: linear-gradient(135deg, rgba(80, 110, 220, 0.08), rgba(150, 180, 255, 0.05));
}

.reg-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
}

.reg-card:hover .reg-card-glow {
	opacity: 1;
}

.reg-card-inner {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 36px 32px 32px;
	background: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(12px);
	border: 1px solid rgba(0, 0, 0, 0.05);
	border-radius: 20px;
	min-height: 320px;
	transition: border-color 0.3s;
}

.reg-card:hover .reg-card-inner {
	border-color: rgba(216, 39, 62, 0.15);
}

.reg-card-store:hover .reg-card-inner {
	border-color: rgba(80, 110, 220, 0.2);
}

.reg-card-icon {
	width: auto;
	height: auto;
	margin-bottom: 20px;
	background: none;
}

.reg-card-icon-3d {
	perspective: 400px;
}

.reg-icon-scene {
	width: 96px;
	height: 96px;
	border-radius: 22px;
	background: linear-gradient(145deg, rgba(255, 240, 243, 0.9), rgba(255, 220, 228, 0.6));
	border: 1px solid rgba(216, 39, 62, 0.1);
	box-shadow: 0 8px 24px rgba(216, 39, 62, 0.1);
	display: flex;
	align-items: center;
	justify-content: center;
	animation: reg-icon-float 5s ease-in-out infinite;
	transition: transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.reg-icon-scene-blue {
	background: linear-gradient(145deg, rgba(235, 240, 255, 0.9), rgba(210, 220, 255, 0.6));
	border-color: rgba(80, 110, 220, 0.12);
	box-shadow: 0 8px 24px rgba(80, 110, 220, 0.1);
	animation-delay: -2s;
}

.reg-icon-svg {
	width: 80px;
	height: 80px;
	display: block;
}

.reg-card:hover .reg-icon-scene {
	transform: rotateY(-12deg) rotateX(8deg) scale(1.06);
	box-shadow: 0 12px 32px rgba(216, 39, 62, 0.18);
}

.reg-card-store:hover .reg-icon-scene {
	box-shadow: 0 12px 32px rgba(80, 110, 220, 0.18);
}

@keyframes reg-icon-float {
	0%, 100% { transform: translateY(0) rotateY(0deg); }
	50%      { transform: translateY(-6px) rotateY(8deg); }
}

.reg-card-person .reg-card-icon,
.reg-card-store .reg-card-icon {
	color: inherit;
}

.reg-card:hover .reg-card-icon {
	transform: none;
}

.reg-card-title {
	font-size: 24px;
	font-weight: 700;
	margin: 0 0 10px;
	color: #1a1a2e;
}

.reg-card-desc {
	font-size: 14px;
	line-height: 1.7;
	color: #6b7280;
	margin: 0 0 20px;
	flex: 1;
}

.reg-card-tags {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.reg-card-tags li {
	padding: 5px 12px;
	border-radius: 16px;
	font-size: 12px;
	font-weight: 500;
	color: #6b7280;
	background: #f3f4f6;
}

.reg-card-person:hover .reg-card-tags li {
	background: rgba(216, 39, 62, 0.08);
	color: #d8273e;
}

.reg-card-store:hover .reg-card-tags li {
	background: rgba(80, 110, 220, 0.08);
	color: #506edc;
}

.reg-card-arrow {
	position: absolute;
	bottom: 32px;
	right: 32px;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #f3f4f6;
	color: #9ca3af;
	transition: all 0.35s;
}

.reg-card-arrow svg {
	width: 18px;
	height: 18px;
}

.reg-card:hover .reg-card-arrow {
	background: #d8273e;
	color: #fff;
	transform: translateX(4px);
	box-shadow: 0 4px 12px rgba(216, 39, 62, 0.3);
}

.reg-card-store:hover .reg-card-arrow {
	background: #506edc;
	box-shadow: 0 4px 12px rgba(80, 110, 220, 0.3);
}

/* 底部权益 */
.reg-benefits {
	display: flex;
	justify-content: center;
	gap: 32px;
	margin-top: 40px;
	animation: reg-fade-up 0.7s ease-out 0.3s both;
}

.reg-benefit {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: #6b7280;
}

.reg-benefit-icon {
	width: 22px;
	height: 22px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-size: 11px;
	font-weight: 700;
	color: #fff;
	background: linear-gradient(135deg, #4ade80, #22c55e);
}

/* ---------- 页脚 ---------- */
.reg-footer {
	text-align: center;
	padding: 20px 0 24px;
	font-size: 12px;
	color: #9ca3af;
}

.reg-footer a {
	color: #d8273e;
	text-decoration: none;
}

.reg-footer a:hover {
	text-decoration: underline;
}

.reg-footer-sep {
	margin: 0 10px;
	opacity: 0.5;
}

@keyframes reg-fade-up {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* ---------- 响应式 ---------- */
@media (max-width: 768px) {
	.reg-wrap {
		padding: 0 20px;
	}

	.reg-hero-title {
		font-size: 32px;
	}

	.reg-steps-bar {
		padding: 24px 24px 20px;
	}

	.reg-steps-track {
		left: 50px;
		right: 50px;
		top: 50px;
	}

	.reg-step-circle {
		width: 40px;
		height: 40px;
	}

	.reg-step-circle svg {
		width: 16px;
		height: 16px;
	}

	.reg-step-label {
		font-size: 11px;
		white-space: normal;
		max-width: 72px;
		line-height: 1.3;
	}

	.reg-3d-scene {
		top: 70px;
		left: 10px;
		width: 120px;
		height: 120px;
		opacity: 0.7;
	}

	.reg-3d-stage {
		width: 120px;
		height: 120px;
	}

	.reg-orbit-system {
		width: 100px;
		height: 100px;
		transform: scale(0.75);
		transform-origin: center center;
	}

	.reg-cards {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.reg-card-inner {
		min-height: auto;
		padding: 28px 24px 56px;
	}

	.reg-benefits {
		flex-direction: column;
		align-items: center;
		gap: 12px;
	}

	.reg-header-login span {
		display: none;
	}

	.reg-header-login {
		padding: 10px 14px;
	}
}

@media (max-width: 480px) {
	.reg-hero-title {
		font-size: 28px;
	}

	.reg-card-title {
		font-size: 20px;
	}
}

/* ============================================================
   个人注册表单页 register_person.html
   ============================================================ */
.reg-wrap-form {
	max-width: 1140px;
}

.reg-main-form {
	align-items: stretch;
	padding-bottom: 40px;
}

/* 步骤条 — 第2步 */
.reg-steps-step2 .reg-steps-progress {
	width: 50%;
}

.reg-step-done .reg-step-circle {
	background: linear-gradient(135deg, #4ade80, #22c55e);
	border-color: transparent;
	color: #fff;
	box-shadow: 0 4px 12px rgba(34, 197, 94, 0.3);
}

.reg-step-done .reg-step-label {
	color: #22c55e;
	font-weight: 600;
}

/* 左右分栏 */
.reg-form-layout {
	display: grid;
	grid-template-columns: 360px 1fr;
	gap: 32px;
	width: 100%;
	animation: reg-fade-up 0.7s ease-out 0.2s both;
}

.reg-form-aside {
	padding: 36px 0 20px;
}

.reg-form-aside-title {
	font-size: 36px;
	font-weight: 800;
	line-height: 1.3;
	margin: 0 0 14px;
	color: #1a1a2e;
	letter-spacing: -0.5px;
}

.reg-form-aside-title em {
	font-style: normal;
	background: linear-gradient(135deg, #d8273e, #ff6b8a);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.reg-form-aside-desc {
	font-size: 14px;
	line-height: 1.8;
	color: #6b7280;
	margin: 0 0 28px;
}

.reg-form-tips {
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.reg-form-tips li {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 16px 18px;
	background: rgba(255, 255, 255, 0.75);
	border: 1px solid rgba(0, 0, 0, 0.04);
	border-radius: 14px;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
	transition: transform 0.3s, box-shadow 0.3s;
	animation: reg-fade-up 0.6s ease-out both;
}

.reg-form-tips li:nth-child(1) { animation-delay: 0.3s; }
.reg-form-tips li:nth-child(2) { animation-delay: 0.4s; }
.reg-form-tips li:nth-child(3) { animation-delay: 0.5s; }

.reg-form-tips li:hover {
	transform: translateX(6px);
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.07);
}

.reg-form-tip-icon {
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	font-weight: 700;
	color: #fff;
	border-radius: 10px;
	background: linear-gradient(135deg, #e8455c, #d8273e);
	box-shadow: 0 4px 10px rgba(216, 39, 62, 0.25);
}

.reg-form-tips li strong {
	display: block;
	font-size: 14px;
	color: #1a1a2e;
	margin-bottom: 3px;
}

.reg-form-tips li p {
	margin: 0;
	font-size: 12px;
	color: #9ca3af;
	line-height: 1.5;
}

.reg-form-back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: #6b7280;
	text-decoration: none;
	padding: 10px 16px;
	border-radius: 24px;
	border: 1px solid #e5e7eb;
	background: rgba(255, 255, 255, 0.6);
	transition: all 0.25s;
}

.reg-form-back svg {
	width: 16px;
	height: 16px;
}

.reg-form-back:hover {
	color: #d8273e;
	border-color: rgba(216, 39, 62, 0.2);
	background: rgba(216, 39, 62, 0.05);
	transform: translateX(-4px);
}

/* 表单卡片 */
.reg-form-card {
	background: rgba(255, 255, 255, 0.9);
	backdrop-filter: blur(16px);
	border: 1px solid rgba(255, 255, 255, 0.9);
	border-radius: 20px;
	padding: 36px 40px 40px;
	box-shadow: 0 8px 40px rgba(0, 0, 0, 0.06);
	animation: reg-form-card-in 0.8s ease-out 0.25s both;
}

@keyframes reg-form-card-in {
	from { opacity: 0; transform: translateY(24px) scale(0.98); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

.reg-form-card-head {
	margin-bottom: 28px;
	padding-bottom: 20px;
	border-bottom: 1px solid #f0f0f0;
}

.reg-form-card-head h2 {
	font-size: 22px;
	font-weight: 700;
	margin: 0 0 6px;
	color: #1a1a2e;
}

.reg-form-card-head p {
	font-size: 13px;
	color: #9ca3af;
	margin: 0;
}

/* 表单字段 */
.reg-form {
	margin: 0;
}

.reg-field {
	margin-bottom: 20px;
	animation: reg-field-in 0.5s ease-out both;
}

.reg-field:nth-child(1) { animation-delay: 0.1s; }
.reg-field:nth-child(2) { animation-delay: 0.15s; }
.reg-field:nth-child(3) { animation-delay: 0.2s; }
.reg-field:nth-child(4) { animation-delay: 0.25s; }
.reg-field:nth-child(5) { animation-delay: 0.3s; }
.reg-field:nth-child(6) { animation-delay: 0.35s; }
.reg-field:nth-child(7) { animation-delay: 0.4s; }
.reg-field:nth-child(8) { animation-delay: 0.45s; }

@keyframes reg-field-in {
	from { opacity: 0; transform: translateX(12px); }
	to   { opacity: 1; transform: translateX(0); }
}

.reg-field-label {
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: #374151;
	margin-bottom: 8px;
}

.reg-required {
	color: #d8273e;
	margin-right: 2px;
}

.reg-field-box {
	display: flex;
	align-items: center;
	background: #f9fafb;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	padding: 0 14px 0 12px;
	transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
}

.reg-field-box:focus-within {
	border-color: #d8273e;
	background: #fff;
	box-shadow: 0 0 0 3px rgba(216, 39, 62, 0.1);
}

.reg-field-box:focus-within .reg-field-icon {
	color: #d8273e;
	background: rgba(216, 39, 62, 0.1);
}

.reg-field-icon {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	margin-right: 10px;
	border-radius: 8px;
	color: #9ca3af;
	background: rgba(0, 0, 0, 0.03);
	transition: color 0.2s, background 0.2s;
}

.reg-field-icon svg {
	width: 18px;
	height: 18px;
}

.reg-input {
	flex: 1;
	background: transparent;
	border: none;
	outline: none;
	color: #1a1a2e;
	font-size: 14px;
	padding: 13px 0;
	font-family: inherit;
	min-width: 0;
}

.reg-input::placeholder {
	color: #c4c9d4;
}

.reg-field-code,
.reg-field-sms {
	gap: 10px;
	flex-wrap: wrap;
}

.reg-input-code {
	flex: 1;
	min-width: 80px;
}

.reg-authcode {
	height: 38px;
	border-radius: 8px;
	cursor: pointer;
	border: 1px solid #e5e7eb;
	flex-shrink: 0;
}

.reg-sms-btn {
	flex-shrink: 0;
	padding: 8px 14px;
	border: none;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 500;
	color: #fff;
	background: linear-gradient(135deg, #e8455c, #d8273e);
	cursor: pointer;
	white-space: nowrap;
	font-family: inherit;
	transition: opacity 0.2s;
}

.reg-sms-btn.disabled {
	opacity: 0.7;
	cursor: not-allowed;
}

.reg-sms-btn:hover:not(.disabled) {
	opacity: 0.9;
}

/* 密码强度 */
.reg-pw-strength {
	margin-top: 10px;
}

.reg-pw-bar {
	display: flex;
	gap: 6px;
	width: 100%;
	height: auto;
	background: none;
}

.reg-pw-bar .reg-pw-seg {
	flex: 1;
	height: 6px;
	border-radius: 3px;
	background: #e5e7eb;
	position: relative;
	overflow: hidden;
}

.reg-pw-bar .reg-pw-seg em {
	position: absolute;
	top: 12px;
	left: 50%;
	transform: translateX(-50%);
	font-style: normal;
	font-size: 11px;
	color: #9ca3af;
	white-space: nowrap;
}

.reg-pw-bar .reg-pw-seg.reg-pw-on {
	background: linear-gradient(90deg, #fbbf24, #f59e0b);
}

#pw_check_2 .reg-pw-seg.reg-pw-on {
	background: linear-gradient(90deg, #fb923c, #f97316);
}

#pw_check_3 .reg-pw-seg.reg-pw-on {
	background: linear-gradient(90deg, #4ade80, #22c55e);
}

#pw_check_1 .reg-pw-weak.reg-pw-on {
	background: linear-gradient(90deg, #fca5a5, #ef4444);
}

.reg-pw-bar {
	padding-bottom: 18px;
}

/* 验证问题 */
.reg-qfont {
	font-size: 13px;
	color: #6b7280;
	margin-top: 8px;
	padding: 10px 14px;
	background: #f9fafb;
	border-radius: 8px;
	border-left: 3px solid #d8273e;
}

/* 协议 */
.reg-agree {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 24px 0 20px;
	padding: 16px;
	background: #f9fafb;
	border-radius: 12px;
	border: 1px solid #eef0f4;
}

.reg-agree-label {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: #6b7280;
	cursor: pointer;
}

.reg-agree-label input {
	accent-color: #d8273e;
	width: 16px;
	height: 16px;
}

.reg-agree-links a {
	font-size: 13px;
	color: #d8273e;
	text-decoration: none;
	font-weight: 500;
	margin-right: 8px;
}

.reg-agree-links a:hover {
	text-decoration: underline;
}

/* 提交按钮 */
.reg-submit {
	width: 100%;
	padding: 15px;
	border: none;
	border-radius: 12px;
	font-size: 16px;
	font-weight: 600;
	color: #fff;
	cursor: pointer;
	background: linear-gradient(135deg, #e8455c 0%, #d8273e 100%);
	box-shadow: 0 4px 20px rgba(216, 39, 62, 0.35);
	font-family: inherit;
	transition: transform 0.2s, box-shadow 0.2s;
	position: relative;
	overflow: hidden;
}

.reg-submit::after {
	content: "";
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
	animation: reg-btn-shine 3s ease-in-out infinite;
}

@keyframes reg-btn-shine {
	0%   { left: -100%; }
	50%  { left: 100%; }
	100% { left: 100%; }
}

.reg-submit:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 28px rgba(216, 39, 62, 0.45);
}

.reg-submit span {
	position: relative;
	z-index: 1;
}

/* 弹窗 */
.reg-pop-layer {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.45);
	z-index: 100;
	backdrop-filter: blur(4px);
}

.reg-modal {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 101;
	width: 800px;
	max-width: 92vw;
	max-height: 80vh;
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 24px 80px rgba(0, 0, 0, 0.2);
	overflow: hidden;
	flex-direction: column;
}

.reg-modal-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 24px;
	background: #fafafa;
	border-bottom: 1px solid #eee;
}

.reg-modal-head h3 {
	margin: 0;
	font-size: 16px;
	color: #d8273e;
}

.reg-modal-close {
	font-size: 24px;
	color: #9ca3af;
	text-decoration: none;
	line-height: 1;
	transition: color 0.2s;
}

.reg-modal-close:hover {
	color: #d8273e;
}

.reg-modal-body {
	padding: 24px;
	overflow-y: auto;
	max-height: calc(80vh - 120px);
	font-size: 14px;
	line-height: 1.8;
	color: #4b5563;
}

.reg-modal-body p {
	margin: 0 0 12px;
}

.reg-modal-foot {
	padding: 16px 24px;
	border-top: 1px solid #eee;
	text-align: center;
}

.reg-modal-btn {
	padding: 10px 32px;
	border: none;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 500;
	color: #fff;
	background: linear-gradient(135deg, #e8455c, #d8273e);
	cursor: pointer;
	font-family: inherit;
}

.reg-modal-btn:hover {
	opacity: 0.9;
}

.reg-page-form .art strong {
	font-weight: 700;
}

/* 表单页响应式 */
@media (max-width: 960px) {
	.reg-form-layout {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.reg-form-aside {
		text-align: center;
		padding-top: 10px;
	}

	.reg-form-tips li {
		text-align: left;
	}

	.reg-form-back {
		margin: 0 auto;
	}

	.reg-form-card {
		padding: 28px 24px 32px;
	}
}

@media (max-width: 480px) {
	.reg-form-aside-title {
		font-size: 28px;
	}

	.reg-form-card {
		padding: 24px 18px 28px;
	}
}

/* ============================================================
   机构注册表单页 register_store.html — 蓝色主题
   ============================================================ */
.reg-wrap-store {
	max-width: 1200px;
}

.reg-form-layout-store {
	grid-template-columns: 300px 1fr;
}

.reg-page-store .reg-form-aside-title em {
	background: linear-gradient(135deg, #506edc, #7b9fff);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.reg-hero-badge-blue {
	color: #506edc;
	background: linear-gradient(135deg, rgba(80, 110, 220, 0.08), rgba(150, 180, 255, 0.12));
}

.reg-form-tip-icon-blue {
	background: linear-gradient(135deg, #7b9fff, #506edc);
	box-shadow: 0 4px 10px rgba(80, 110, 220, 0.25);
}

.reg-header-login-blue {
	color: #506edc;
	background: rgba(80, 110, 220, 0.06);
	border-color: rgba(80, 110, 220, 0.12);
}

.reg-header-login-blue:hover {
	background: rgba(80, 110, 220, 0.12);
}

.reg-form-back-blue:hover {
	color: #506edc;
	border-color: rgba(80, 110, 220, 0.2);
	background: rgba(80, 110, 220, 0.05);
}

.reg-page-store .reg-steps-step2 .reg-steps-progress {
	background: linear-gradient(90deg, #7b9fff, #506edc, #8ba4e8, #7b9fff);
}

.reg-step-active-blue .reg-step-circle {
	background: linear-gradient(135deg, #7b9fff, #506edc);
	box-shadow: 0 4px 16px rgba(80, 110, 220, 0.35);
}

.reg-step-pulse-blue {
	border-color: rgba(80, 110, 220, 0.4);
}

.reg-page-store .reg-required {
	color: #506edc;
}

.reg-page-store .reg-field-box:focus-within {
	border-color: #506edc;
	box-shadow: 0 0 0 3px rgba(80, 110, 220, 0.1);
}

.reg-page-store .reg-field-box:focus-within .reg-field-icon {
	color: #506edc;
	background: rgba(80, 110, 220, 0.1);
}

.reg-orbit-system-blue .reg-core-sphere {
	background: radial-gradient(circle at 35% 30%, #9bb5ff, #506edc 55%, #3d5bb5);
	box-shadow: 0 0 24px rgba(80, 110, 220, 0.45), 0 0 48px rgba(123, 159, 255, 0.2);
}

.reg-orbit-system-blue .reg-core-glow {
	background: radial-gradient(circle, rgba(150, 180, 255, 0.5) 0%, rgba(80, 110, 220, 0.1) 70%, transparent 100%);
}

.reg-form-card-store {
	padding: 32px 36px 40px;
}

.reg-form-section {
	margin-bottom: 28px;
	padding-bottom: 8px;
	border-bottom: 1px dashed #eef0f4;
	animation: reg-fade-up 0.6s ease-out both;
}

.reg-form-section:nth-child(2) { animation-delay: 0.1s; }
.reg-form-section:nth-child(3) { animation-delay: 0.2s; }

.reg-form-section-last {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

.reg-form-section .reg-form-card-head {
	margin-bottom: 22px;
	padding-bottom: 16px;
	border-bottom: 1px solid #f0f0f0;
}

.reg-form-section .reg-form-card-head h2 {
	font-size: 18px;
	display: flex;
	align-items: center;
	gap: 10px;
}

.reg-form-section .reg-form-card-head h2::before {
	content: "";
	width: 4px;
	height: 18px;
	border-radius: 2px;
	background: linear-gradient(180deg, #7b9fff, #506edc);
}

.reg-field-select {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	padding: 10px 14px;
	background: #f9fafb;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.reg-field-select:focus-within {
	border-color: #506edc;
	background: #fff;
	box-shadow: 0 0 0 3px rgba(80, 110, 220, 0.1);
}

.reg-field-select select,
.reg-page-store .catid select {
	padding: 8px 12px;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	font-size: 13px;
	color: #374151;
	background: #fff;
	font-family: inherit;
	min-width: 120px;
	outline: none;
	transition: border-color 0.2s;
}

.reg-field-select select:focus,
.reg-page-store .catid select:focus {
	border-color: #506edc;
}

.reg-textarea {
	width: 100%;
	min-height: 140px;
	padding: 14px 16px;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	font-size: 14px;
	line-height: 1.7;
	color: #1a1a2e;
	background: #f9fafb;
	font-family: inherit;
	resize: vertical;
	outline: none;
	transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
}

.reg-textarea:focus {
	border-color: #506edc;
	background: #fff;
	box-shadow: 0 0 0 3px rgba(80, 110, 220, 0.1);
}

.reg-textarea::placeholder {
	color: #c4c9d4;
}

.reg-field-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

.reg-field-half {
	margin-bottom: 20px;
}

.reg-submit-blue {
	background: linear-gradient(135deg, #7b9fff 0%, #506edc 100%);
	box-shadow: 0 4px 20px rgba(80, 110, 220, 0.35);
}

.reg-submit-blue:hover {
	box-shadow: 0 8px 28px rgba(80, 110, 220, 0.45);
}

.reg-submit-blue::after {
	animation: reg-btn-shine 3s ease-in-out infinite;
}

.reg-sms-btn-blue {
	background: linear-gradient(135deg, #7b9fff, #506edc);
}

.reg-page-store .reg-agree-links a {
	color: #506edc;
}

.reg-page-store .reg-agree-label input {
	accent-color: #506edc;
}

.reg-modal-head-blue h3 {
	color: #506edc;
}

.reg-modal-btn-blue {
	background: linear-gradient(135deg, #7b9fff, #506edc);
}

.reg-page-store .reg-qfont {
	border-left-color: #506edc;
}

@media (max-width: 960px) {
	.reg-form-layout-store {
		grid-template-columns: 1fr;
	}

	.reg-field-row {
		grid-template-columns: 1fr;
	}

	.reg-field-half {
		margin-bottom: 0;
	}
}

@media (max-width: 480px) {
	.reg-form-card-store {
		padding: 24px 18px 28px;
	}
}

/* ============================================================
   注册结果页 register_2.html — 动态加载动画
   ============================================================ */
.reg-wrap-result {
	max-width: 900px;
}

.reg-main-result {
	align-items: center;
	padding-bottom: 50px;
}

.reg-steps-step3 .reg-steps-progress {
	width: 100%;
}

/* 结果卡片 */
.reg-result-card {
	width: 100%;
	max-width: 640px;
	margin-top: 20px;
	padding: 48px 40px 40px;
	text-align: center;
	background: rgba(255, 255, 255, 0.9);
	backdrop-filter: blur(16px);
	border: 1px solid rgba(255, 255, 255, 0.9);
	border-radius: 24px;
	box-shadow: 0 12px 48px rgba(0, 0, 0, 0.07);
	animation: reg-result-in 0.8s ease-out both;
}

@keyframes reg-result-in {
	from { opacity: 0; transform: translateY(30px) scale(0.97); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

.reg-result-visual {
	display: flex;
	justify-content: center;
	margin-bottom: 32px;
	min-height: 120px;
	align-items: center;
}

/* 审核等待 — 3D 旋绕加载 */
.reg-loader {
	position: relative;
	width: 100px;
	height: 100px;
}

.reg-loader-orbit {
	position: absolute;
	top: 50%;
	left: 50%;
	border-radius: 50%;
	border: 2px solid transparent;
	transform-style: preserve-3d;
}

.reg-loader-orbit-1 {
	width: 96px;
	height: 96px;
	margin: -48px 0 0 -48px;
	border-top-color: #d8273e;
	border-right-color: rgba(216, 39, 62, 0.2);
	animation: reg-loader-spin 1.2s linear infinite;
}

.reg-loader-orbit-2 {
	width: 72px;
	height: 72px;
	margin: -36px 0 0 -36px;
	border-top-color: #ff6b8a;
	border-left-color: rgba(255, 107, 138, 0.2);
	animation: reg-loader-spin 1.8s linear infinite reverse;
}

.reg-loader-orbit-3 {
	width: 48px;
	height: 48px;
	margin: -24px 0 0 -24px;
	border-top-color: #ffb3c1;
	animation: reg-loader-spin 2.4s linear infinite;
}

.reg-loader-core {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 16px;
	height: 16px;
	margin: -8px 0 0 -8px;
	border-radius: 50%;
	background: linear-gradient(135deg, #ff6b8a, #d8273e);
	box-shadow: 0 0 20px rgba(216, 39, 62, 0.5);
	animation: reg-loader-pulse 1.5s ease-in-out infinite alternate;
}

@keyframes reg-loader-spin {
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}

@keyframes reg-loader-pulse {
	0%   { transform: scale(1); opacity: 0.8; }
	100% { transform: scale(1.3); opacity: 1; }
}

/* 邮件发送动画 */
.reg-loader-mail {
	position: relative;
	width: 100px;
	height: 100px;
}

.reg-mail-orbit {
	position: absolute;
	inset: 0;
	border: 2px dashed rgba(216, 39, 62, 0.2);
	border-radius: 50%;
	animation: reg-loader-spin 8s linear infinite;
}

.reg-mail-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 48px;
	height: 48px;
	margin: -24px 0 0 -24px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #d8273e;
	background: rgba(216, 39, 62, 0.08);
	border-radius: 14px;
	animation: reg-mail-bounce 2s ease-in-out infinite;
}

.reg-mail-icon svg {
	width: 28px;
	height: 28px;
}

.reg-mail-dot {
	position: absolute;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ff6b8a;
	animation: reg-mail-fly 2s ease-in-out infinite;
}

.reg-mail-dot-1 { top: 10%; left: 50%; animation-delay: 0s; }
.reg-mail-dot-2 { top: 50%; right: 5%; animation-delay: -0.6s; }
.reg-mail-dot-3 { bottom: 10%; left: 30%; animation-delay: -1.2s; }

@keyframes reg-mail-bounce {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-6px); }
}

@keyframes reg-mail-fly {
	0%, 100% { opacity: 0.3; transform: scale(0.8); }
	50%      { opacity: 1; transform: scale(1.2); }
}

/* 成功动画 */
.reg-loader-success {
	position: relative;
	width: 100px;
	height: 100px;
}

.reg-success-ring {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 3px solid rgba(34, 197, 94, 0.2);
	animation: reg-success-ring 1s ease-out forwards;
}

@keyframes reg-success-ring {
	from { transform: scale(0.5); opacity: 0; }
	to   { transform: scale(1); opacity: 1; }
}

.reg-success-check {
	width: 100px;
	height: 100px;
}

.reg-success-circle {
	stroke: #22c55e;
	stroke-width: 2;
	stroke-dasharray: 166;
	stroke-dashoffset: 166;
	animation: reg-success-stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) 0.2s forwards;
}

.reg-success-path {
	stroke: #22c55e;
	stroke-width: 3;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-dasharray: 48;
	stroke-dashoffset: 48;
	animation: reg-success-stroke 0.4s cubic-bezier(0.65, 0, 0.45, 1) 0.6s forwards;
}

@keyframes reg-success-stroke {
	to { stroke-dashoffset: 0; }
}

/* 错误动画 */
.reg-loader-error {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background: rgba(239, 68, 68, 0.08);
	border: 2px solid rgba(239, 68, 68, 0.2);
	display: flex;
	align-items: center;
	justify-content: center;
	animation: reg-error-shake 0.6s ease-out;
}

.reg-loader-error-icon {
	font-size: 36px;
	font-weight: 700;
	color: #ef4444;
	line-height: 1;
	animation: reg-error-pulse 2s ease-in-out infinite;
}

@keyframes reg-error-shake {
	0%, 100% { transform: translateX(0); }
	20%      { transform: translateX(-6px); }
	40%      { transform: translateX(6px); }
	60%      { transform: translateX(-4px); }
	80%      { transform: translateX(4px); }
}

@keyframes reg-error-pulse {
	0%, 100% { opacity: 0.7; transform: scale(1); }
	50%      { opacity: 1; transform: scale(1.1); }
}

/* 文字与按钮 */
.reg-result-title {
	font-size: 24px;
	font-weight: 700;
	color: #1a1a2e;
	margin: 0 0 14px;
	line-height: 1.4;
	animation: reg-fade-up 0.6s ease-out 0.2s both;
}

.reg-result-title-success {
	color: #16a34a;
}

.reg-result-title-error {
	color: #dc2626;
}

.reg-result-desc {
	font-size: 14px;
	line-height: 1.8;
	color: #6b7280;
	margin: 0 0 24px;
	animation: reg-fade-up 0.6s ease-out 0.3s both;
}

.reg-result-highlight {
	margin: 0 0 16px;
	animation: reg-fade-up 0.6s ease-out 0.25s both;
}

.reg-result-highlight a {
	font-size: 15px;
	font-weight: 600;
	color: #d8273e;
	text-decoration: none;
	padding: 10px 20px;
	border-radius: 24px;
	background: rgba(216, 39, 62, 0.08);
	display: inline-block;
	transition: background 0.2s;
}

.reg-result-highlight a:hover {
	background: rgba(216, 39, 62, 0.15);
}

.reg-result-userid {
	color: #d8273e;
	font-weight: 700;
}

/* 审核进度条 */
.reg-result-progress {
	width: 100%;
	max-width: 280px;
	height: 4px;
	margin: 0 auto 28px;
	background: #eef0f4;
	border-radius: 4px;
	overflow: hidden;
	animation: reg-fade-up 0.6s ease-out 0.35s both;
}

.reg-result-progress-bar {
	height: 100%;
	width: 40%;
	border-radius: 4px;
	background: linear-gradient(90deg, #e8455c, #ff6b8a, #e8455c);
	background-size: 200% 100%;
	animation: reg-progress-indeterminate 2s ease-in-out infinite;
}

@keyframes reg-progress-indeterminate {
	0%   { width: 20%; margin-left: 0; background-position: 0% 50%; }
	50%  { width: 60%; margin-left: 20%; background-position: 100% 50%; }
	100% { width: 20%; margin-left: 80%; background-position: 0% 50%; }
}

.reg-result-actions {
	display: flex;
	justify-content: center;
	gap: 14px;
	flex-wrap: wrap;
	animation: reg-fade-up 0.6s ease-out 0.4s both;
}

.reg-result-btn {
	display: inline-block;
	padding: 12px 28px;
	border-radius: 24px;
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	text-decoration: none;
	background: linear-gradient(135deg, #e8455c, #d8273e);
	box-shadow: 0 4px 16px rgba(216, 39, 62, 0.3);
	transition: transform 0.2s, box-shadow 0.2s;
}

.reg-result-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(216, 39, 62, 0.4);
}

.reg-result-btn-outline {
	color: #d8273e;
	background: transparent;
	border: 1px solid rgba(216, 39, 62, 0.3);
	box-shadow: none;
}

.reg-result-btn-outline:hover {
	background: rgba(216, 39, 62, 0.06);
	box-shadow: none;
}

@media (max-width: 768px) {
	.reg-result-card {
		padding: 36px 24px 32px;
		margin-top: 10px;
	}

	.reg-result-title {
		font-size: 20px;
	}

	.reg-steps-bar {
		padding: 24px 20px 20px;
	}
}
