/* ===== 柔和视觉：更温润的配色、圆角与控件 ===== */
:root {
    --primary: #6B63E8;
    --primary-light: #8B84F0;
    --primary-dark: #554FD4;
    --accent: #4A9FE8;
    --gradient-primary: linear-gradient(135deg, #7B74EE 0%, #5BA8F0 100%);
    --bg-gradient: linear-gradient(180deg, #F7F8FD 0%, #EEF0FB 45%, #F9FAFE 100%);
    --card-shadow: 0 2px 20px rgba(107, 99, 232, 0.06);
    --card-shadow-hover: 0 6px 28px rgba(107, 99, 232, 0.1);
    --text: #2D2D3A;
    --text-secondary: #6B6B80;
    --text-muted: #A8A8BA;
    --radius-sm: 12px;
    --radius-md: 16px;
    --radius-lg: 22px;
    --radius-xl: 32px;
    --error: #F07178;
    --error-bg: #FFF5F6;
    --success: #3DBD8C;
    --success-bg: #EFFAF5;
    --warning-bg: #FFF8EE;
    --info-bg: #F0F6FF;
}

body::before {
    opacity: 0.45;
    background-size: 32px 32px;
}

.step-card {
    border: 1px solid rgba(107, 99, 232, 0.08);
    box-shadow: var(--card-shadow);
}

.step-title {
    font-weight: 600 !important;
    letter-spacing: 0.01em;
}

.step-desc {
    color: var(--text-secondary) !important;
    line-height: 1.55 !important;
}

.step-icon-wrap {
    background: linear-gradient(135deg, rgba(107, 99, 232, 0.08), rgba(91, 168, 240, 0.08)) !important;
}

.form-label {
    font-weight: 500 !important;
    color: var(--text-secondary) !important;
}

.form-input {
    border-width: 1px !important;
    border-color: #E4E6F0 !important;
    background: #FCFCFF !important;
    border-radius: var(--radius-md) !important;
    transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease !important;
}

.form-input:focus {
    border-color: var(--primary-light) !important;
    box-shadow: 0 0 0 3px rgba(107, 99, 232, 0.1) !important;
    background: #fff !important;
}

.form-input.error {
    border-color: var(--error) !important;
    background: var(--error-bg) !important;
}

.btn-primary {
    font-weight: 500 !important;
    border-radius: var(--radius-md) !important;
    box-shadow: 0 3px 12px rgba(107, 99, 232, 0.2) !important;
    letter-spacing: 0.02em;
}

.btn-primary:active {
    transform: scale(0.98);
}

.btn-primary:disabled {
    background: #D8DAE8 !important;
}

.btn-secondary {
    border-width: 1px !important;
    border-color: #E0E3EF !important;
    background: #FAFBFE !important;
    color: var(--text-secondary) !important;
    font-weight: 500 !important;
    border-radius: var(--radius-md) !important;
}

.btn-outline {
    border-width: 1px !important;
    font-weight: 500 !important;
    border-radius: var(--radius-md) !important;
}

.material-item {
    border-width: 1px !important;
    border-color: #E8EAF4 !important;
    border-radius: var(--radius-md) !important;
    background: #FCFCFF !important;
}

.material-item.selected {
    border-color: rgba(107, 99, 232, 0.35) !important;
    box-shadow: 0 2px 10px rgba(107, 99, 232, 0.08) !important;
}

.privacy-grid-item {
    background: #F9FAFE !important;
    border-color: #ECEEF6 !important;
    border-radius: var(--radius-sm) !important;
}

.privacy-note {
    background: rgba(107, 99, 232, 0.05) !important;
    border-radius: var(--radius-sm) !important;
    color: var(--text-secondary) !important;
}

.checkbox-row {
    color: var(--text-secondary) !important;
}

.status-msg {
    border-radius: var(--radius-sm) !important;
    font-weight: 400 !important;
}

.status-msg.error {
    background: var(--error-bg) !important;
    color: #C45A60 !important;
}

.error-msg {
    color: #C45A60 !important;
    font-weight: 400 !important;
}

.progress-step-label {
    font-weight: 500 !important;
    color: var(--primary) !important;
    background: rgba(255, 255, 255, 0.92) !important;
    box-shadow: 0 1px 8px rgba(107, 99, 232, 0.08);
}

.progress-status-card {
    border-width: 1px !important;
}

.status-pending {
    background: linear-gradient(135deg, #FFFBF0, #FFF6E0) !important;
    border-color: rgba(255, 193, 7, 0.35) !important;
}

.status-approved {
    background: linear-gradient(135deg, #F0FAF5, #E4F5EC) !important;
    border-color: rgba(61, 189, 140, 0.35) !important;
}

.status-rejected {
    background: linear-gradient(135deg, #FFF6F6, #FFEBEC) !important;
    border-color: rgba(240, 113, 120, 0.35) !important;
}

.progress-status-text {
    font-weight: 600 !important;
}

.reject-reason {
    background: rgba(240, 113, 120, 0.06) !important;
    border-radius: var(--radius-sm) !important;
}

.reason-label {
    font-weight: 500 !important;
    color: #C45A60 !important;
}

.summary-box,
.info-card,
.notice-box {
    border-radius: var(--radius-md) !important;
}

.verifying-box {
    border-radius: var(--radius-md) !important;
    background: rgba(107, 99, 232, 0.04) !important;
    border-color: rgba(107, 99, 232, 0.12) !important;
}

.verifying-title {
    font-weight: 600 !important;
    color: var(--primary) !important;
}

.face-hint-chip {
    background: #F5F6FC !important;
    border-color: #ECEEF6 !important;
    color: var(--text-secondary) !important;
}

.face-phase-pill {
    font-weight: 500 !important;
    background: #F3F4FA !important;
}

.face-action-bar p {
    font-weight: 500 !important;
}

.landing-container {
    background: linear-gradient(145deg, #7B74EE 0%, #5BA8F0 100%) !important;
}

.landing-card {
    border-radius: var(--radius-xl) !important;
    box-shadow: 0 8px 40px rgba(45, 45, 58, 0.12) !important;
}

.landing-title {
    font-weight: 600 !important;
    color: var(--text) !important;
}

.landing-desc {
    color: var(--text-secondary) !important;
}

.landing-hint {
    color: var(--text-muted) !important;
}