page {
  background: #f7f8fb;
  color: #161a27;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  font-size: 28rpx;
  box-sizing: border-box;
}

page,
view,
text,
button,
input,
textarea,
scroll-view {
  box-sizing: border-box;
}

button::after {
  border: 0;
}

.page {
  min-height: 100vh;
  padding: 34rpx 30rpx 150rpx;
}

.page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 34rpx;
}

.eyebrow {
  color: #315bea;
  font-size: 22rpx;
  font-weight: 700;
  letter-spacing: 2rpx;
}

.page-title {
  display: block;
  margin-top: 10rpx;
  font-size: 46rpx;
  font-weight: 750;
  letter-spacing: 0;
}

.page-subtitle {
  display: block;
  margin-top: 10rpx;
  color: #747b8e;
  font-size: 24rpx;
  line-height: 1.6;
}

.surface {
  background: #ffffff;
  border: 1rpx solid #eef0f6;
  border-radius: 16rpx;
  box-shadow: 0 10rpx 30rpx rgba(30, 44, 87, 0.045);
}

.section-title {
  display: block;
  margin: 34rpx 0 18rpx;
  font-size: 30rpx;
  font-weight: 700;
}

.muted {
  color: #8a90a2;
}

.caption {
  color: #9aa0af;
  font-size: 22rpx;
}

.primary-button,
.secondary-button,
.quiet-button {
  border-radius: 10rpx;
  font-size: 28rpx;
  font-weight: 650;
  line-height: 88rpx;
  padding: 0 28rpx;
}

.primary-button {
  color: #ffffff;
  background: #315bea;
  box-shadow: 0 12rpx 24rpx rgba(49, 91, 234, 0.22);
}

.primary-button[disabled] {
  color: #a4abc0;
  background: #e8ebf3;
  box-shadow: none;
}

.secondary-button {
  color: #315bea;
  background: #edf1ff;
}

.quiet-button {
  color: #5f6678;
  background: #f4f5f8;
}

.row {
  display: flex;
  align-items: center;
}

.between {
  justify-content: space-between;
}

.gap-12 {
  gap: 12rpx;
}

.gap-18 {
  gap: 18rpx;
}

.status-dot {
  width: 14rpx;
  height: 14rpx;
  border-radius: 50%;
  background: #f0b14e;
}

.status-dot.success {
  background: #30b878;
}

.status-dot.danger {
  background: #ec6a72;
}

.empty {
  padding: 74rpx 34rpx;
  text-align: center;
}

.empty-title {
  display: block;
  color: #33394b;
  font-size: 30rpx;
  font-weight: 700;
}

.empty-copy {
  display: block;
  margin-top: 14rpx;
  color: #8a90a2;
  font-size: 24rpx;
  line-height: 1.6;
}

.loading {
  padding: 80rpx 30rpx;
  color: #8a90a2;
  text-align: center;
}

.notice {
  padding: 20rpx 24rpx;
  color: #6b5a2c;
  background: #fff8e8;
  border: 1rpx solid #f5e7bd;
  border-radius: 16rpx;
  font-size: 23rpx;
  line-height: 1.55;
}