:root {
    --wm-theme-ink: #2f2a68;
    --wm-theme-muted: #667085;
    --wm-theme-line: #e6e9f3;
    --wm-theme-surface: #ffffff;
    --wm-theme-soft: #f6f7fb;
    --wm-theme-primary: #6d4aff;
    --wm-theme-primary-rgb: 109, 74, 255;
    --wm-theme-primary-dark: #4d3d99;
    --wm-theme-primary-gradient: linear-gradient(135deg, var(--wm-theme-primary), var(--wm-theme-primary-dark));
    --wm-theme-primary-gradient-hover: linear-gradient(135deg, #5f3fff, var(--wm-theme-primary-dark));
    --wm-theme-primary-shadow: 0 14px 28px rgba(109, 74, 255, 0.24);
    --wm-theme-success: #087b62;
    --wm-theme-success-soft: #e9fbf5;
    --wm-theme-danger: #e5484d;
    --wm-theme-danger-dark: #b42329;
    --wm-theme-amber: #f59e0b;
    --wm-theme-accent-blue: #5e8fff;
    --wm-theme-accent-cyan: paleturquoise;
    --wm-theme-accent-cyan-rgb: 95, 200, 255;
    --wm-theme-connector-line: rgba(109, 74, 255, 0.36);
    --wm-theme-progress-gradient: linear-gradient(90deg, var(--wm-theme-primary-dark), var(--wm-theme-primary));

    --wm-ink: var(--wm-theme-ink);
    --wm-muted: var(--wm-theme-muted);
    --wm-line: var(--wm-theme-line);
    --wm-surface: var(--wm-theme-surface);
    --wm-soft: var(--wm-theme-soft);
    --wm-primary: var(--wm-theme-primary);
    --wm-primary-dark: var(--wm-theme-primary-dark);
    --wm-primary-gradient: var(--wm-theme-primary-gradient);
    --wm-primary-gradient-hover: var(--wm-theme-primary-gradient-hover);
    --wm-danger: var(--wm-theme-danger);

    --ink: var(--wm-theme-ink);
    --muted: var(--wm-theme-muted);
    --line: var(--wm-theme-line);
    --surface: var(--wm-theme-surface);
    --soft: var(--wm-theme-soft);
    --primary: var(--wm-theme-primary);
    --primary-dark: var(--wm-theme-primary-dark);
    --danger: var(--wm-theme-danger);
}

.wm-primary-gradient {
    background-color: var(--wm-theme-primary) !important;
    background-image: var(--wm-theme-primary-gradient) !important;
}

.wm-primary-gradient-hover:hover,
.wm-primary-gradient-hover:focus-visible {
    background-color: var(--wm-theme-primary) !important;
    background-image: var(--wm-theme-primary-gradient-hover) !important;
}

.wm-progress-gradient {
    background-color: var(--wm-theme-primary-dark) !important;
    background-image: var(--wm-theme-progress-gradient) !important;
}

.wm-report-achievement .wm-progress-gradient {
    background-color: #9b8cff !important;
    background-image: linear-gradient(90deg, #aeb8ff 0%, #8f74ff 48%, #76f7ee 100%) !important;
    box-shadow: 0 0 14px rgba(118, 247, 238, 0.28), 0 0 18px rgba(143, 116, 255, 0.24);
}

.bg-\[linear-gradient\(135deg\,\#6d4aff\,\#5e8fff\)\] {
    background-color: var(--wm-theme-primary) !important;
    background-image: var(--wm-theme-primary-gradient) !important;
}

.bg-\[linear-gradient\(90deg\,\#6d4aff\,paleturquoise\)\] {
    background-image: var(--wm-theme-progress-gradient) !important;
}

.bg-\[linear-gradient\(90deg\,darkslateblue\,\#6d3aff\)\] {
    background-color: var(--wm-theme-primary-dark) !important;
    background-image: var(--wm-theme-progress-gradient) !important;
}

.text-\[\#6d4aff\],
.hover\:text-\[\#6d4aff\]:hover,
.group:hover .group-hover\:text-\[\#6d4aff\] {
    color: var(--wm-theme-primary) !important;
}

.focus-visible\:ring-\[\#6d4aff\]:focus-visible {
    --tw-ring-color: var(--wm-theme-primary) !important;
}

.bg-\[\#6d4aff\]\/25 {
    background-color: rgba(var(--wm-theme-primary-rgb), 0.25) !important;
}